本日の学習 (2016年08月19日(金))
CSSの基本を学びます。
CSSの基本を理解
CODEPENを使って試してみると手軽でいいです。
ドットインストールCSS入門
動画で学習します。
ドットインストールCSS3入門
さらに動画で学習します。
CSS3がうまく動かない場合は、 Can I useを使ってチェック。
CSS3 Generator
色々なCSS試せます。試します。
[Flexbox Froggy]{http://flexboxfroggy.com}
ゲーム感覚でFLEXBOXの学習。
演習の実施
成果物: CSS TUTORIAL
演習を行った際に参照したサイトなど
- テキストの縦方向の中央揃えについて
- 使い勝手のよさそうなアイコンをCSSだけで6個作ってみた
- HTMLはシンプルで、紙をぺろっと折ったエフェクトをつけるチュートリアル
- CSSで作図する
- clearfixの最新版 -フロート関連やマージン相殺の不具合を解決するモダンブラウザ用clearfix
- 定義リスト[dl]のdt/ddを横並びにする方法
終了
最後の演習ですごく時間がかかりました。一日中やってた気がします…。
作図する事が慣れておらず、試行錯誤で色々とググりながらやったのが時間がかかった一番の要因です。
おしまい