More Related Content
Viewers also liked (9)
Similar to Css benkyou (13)
Css benkyou
- 3. CSSのどこが難しいのか ? デザインそのものが難しい & 知らない ? GUI構築そのものが複雑で難しい行為 ? CSSの言語仕様の貧弱さ ? CSSの機能が多すぎるので覚えきれない とか、主にそういった理由ではなかろうか。
- 11. 骋鲍滨构筑の复雑さ
- 13. おさえるべきポイント ? UIそのものに対する「気持ち」 ? GUI構築の基本的なパターン ? Webという環境の向き、不向き ? GUI環境として日々進歩しているWeb界隈の情報収集
- 14. WebUIに求められる知見 ? HTMLのセマンティクス ? CSSの仕様 ? 欲しいレイアウトを組むためのノウハウ ? etc…… 上記の内容を駆使しつつ、JavaScriptによる? インタラクションを視野に入れて設計しないといけない。
- 15. 対策 ? HTML、CSSの『仕様』を読む ? JavaScriptも頑張る ? 『何が出来るか』の知見を集める ? 試行錯誤して経験を積む 身も蓋もないけど、これしかない。? 適当にググって、その場しのぎのCSSスニペットを? コピペしたところで永遠に何も身に付かない……。
- 18. メタCSSか次世代CSSを使う ? CSSに対する不満点の7割はそれで解消する ? 変数、四則演算、mixin、関数…… ? コンパイルの手間とかはかかるけど、ペイする いい加減、生のCSSはありえない！！ やめよう！
- 19. 残った3割の不満は？ ? 全てがグローバルなのつらい ? スタイルの再利用性とか幻想じゃないですか ? BEMとかの運用努力にも限界が…… 耐えましょう。
- 21. ReactStyle ? ほぼSPA前提 ? HTML（構造）、CSS（スタイル）、? JavaScript（ロジック）に分裂した世界を統合する 技術 ? スコープの概念がCSSにも！ ? でもそこまでReactに依存していいの……という不安
- 22. Polymer（Web Components） ? スコープ、パーツの再利用性に重きを置いている？ ? WebUIの世界にModuleの概念が！ ? JavaScriptも含めた包括的なスコープを作る ? まだまだ仕様が不安定っぽい雰囲気をかんじる あんまよくわかってないですごめんなさい……
- 23. がんばろう！ 未来は明るい。
- 24. 颁厂厂の机能がおおすぎる
- 26. がむしゃら前の頑張りポイント 1. まず綺麗なHTMLありき！ 2. 次にCSSの基本仕様！ 3. BEMとかそこらへんの知見をおさえる 4. 色々なウェブサービスのUIを日頃から意識する 5. CSSの引き際を覚える（複雑なことはJS） 6. 新しいCSSの仕様をチェックする
- 27. フックポイント ? ボックスモデル ? display ? ?oat（over?ow） ? position ここら辺をおさえておけば、? 基本的なレイアウトはサッと作れるようになる（はず）。
- 28. 中級フック ? 擬似要素、擬似クラス ? box-sizing ? ?exbox ? transform ここら辺をおさえるとちょっと複雑なデザインもがんばれる（かも）。
- 29. まとめ
- 30. ? まずはHTML ? 逆引きテクニックの前に仕様 ? 何かしらのメタCSSは必須 ? BEMで命名する ? 思い通りのレイアウトを作れるようになったら、? 変更に強いコーディングをできるマンになろう ? クラスの再利用性は割り切る ? あんまり複雑なものは諦めてJSを使う
- 31. ?n
- 32. DEMO （いまつくってるやつ）