cos31です。
今回はCSSのクロスブラウザを簡単に利用してもらうための選択肢として「CSS フレームワーク/CSS Reset」を紹介しました。
CSSフレームワークは以下の様な機能を提供しています。
- 外枠(レイアウト)提供
- タイポグラフィ
- デザインの提供
- CSS Reset
CSS Resetは「初期化CSS」と言われているものです。
概要がメインになっていますのでどんなものかを知ることに主眼に置いていますので、CSSコードはほとんど出てきませんのでご了承ください
ちょっと内容の紹介
各ブラウザごとにHTMLタグのエレメントの初期スタイルが異なっている為、同じファイルを閲覧してもこれだけの差異が生まれます。
CSSフレームワークを用いると、この差異を吸収しどのブラウザでもほぼ同様の表示を行うことが可能です。
以下の例は上のコードに、YUI Reset CSS,YUI Font CSS,YUI Base CSSを適応した例です。
他、CSSフレームワークってどんなもん？というのは本編をご覧ください
ムービー
スライドをめくるのが早いという意見がありましたので、資料を手元で見ながら見て頂いた方が解り安いように思います。
プレゼン資料
参考サイト
- CSS Frameworks + CSS Reset: Design From Scratch | CSS | Smashing Magazine
- Yahoo! UI Library: Grids CSS
- Home: Yet Another Multicolumn Layout | An (X)HTML/CSS Framework
- blueprintcss - Google Code
他にも、これいいよってCSSフレームワークがありましたらぜひ、コメントで教えてください〜
コメント / トラックバックはありません
コメントする