興味深いテクニックを多々取り入れているHTML5+CSS3のフレームワーク -Gridless
Post on:2011年6月27日
当サイトの記事でも取り上げている数々のテクニックを取り入れている、IE6/7にも対応したHTML5+CSS3ベースのフレームワークを紹介します。
[ad#ad-2]
Gridlessの主な特徴
- CSSでユーザーのスクリーンサイズに最適なレイアウトを実現します。
参考:Media Queriesをしっかり身につけるチュートリアル - クロスブラウザ対応(IE6/7も含む)
- CSS Resetには、Normalize CSSを使用。
参考:ブラウザのスタイルをリセットするスタイルシート -Normalize CSS - 黄金比をベースにしたサイズと縦のリズムを使ったタイポグラフィ。
- 印刷時のスタイルをプリント時に最適化。
- キャッシュの最適化。
- HTML5+CSS3の採用。
- 安全なCSS Hack。
参考:IE9対応、IEの各バージョンごとに異なるスタイルシートを適用する方法のまとめ - micro clearfixの採用。
参考:スタイルシートの量を少し減らした、新しいclearfix -micro clearfix - よく整理されたフォルダ構造。
Gridlessのデモ
デモではその名のとおりグリッドはありませんが、さまざまなエレメントのデモがあります。
Gridlessの対応ブラウザ
対応ブラウザは、下記の通りです。
- Internet Explorer 6+
- Mozilla Firefox 3.6+
- Google Chrome 11+
- Opera 11+
- Safari 5+
Gridlessのライセンス
利用にあたっては個人でも商用でも無料で、public domainでライセンスはUnlicenseです。
[ad#ad-2]
sponsors