ドットインストール代表のライフハックブログ
商用利用も無料、変更もコピーも再配布もOK、汎用性に優れたレイアウトやUIエレメントをスタンダードなHTML5/CSS3で実装したフレームワークを紹介します。 ウェブサイトを構築する際に、ベースとして利用するのによさそうです。 Markup Framework Markup Frameworkの特徴 Markup Frameworkのサポートブラウザ Markup Frameworkのデモ Markup Frameworkの特徴 レスポンシブ対応、モバイルファーストのレイアウト。 再利用可能なUIエレメントのライブラリ。 最新のスタンダードなHTML5/CSS3を使用。 ピュアなHTMLとCSSで、Hackなし、JavaScriptなしです。 ミニマルなマークアップ。 ページの容量は小さめ。 サーチエンジンにフレンドリー。 アクセシブル。 セマンティックスとスタイルの明確な分離。 モジュー
単独でも素敵なかっこいいエフェクトで十分なのに、それらが全部まとまって、更に実装方法にもこだわったオープンソースのCSSのフレームワークを紹介します。 ドラッグ&ドロップでさまざまなエレメントを表示します。 Maxmertkitの特徴 Maxmertkitのデモ:スタティック Maxmertkitのデモ:CSS3アニメーション Maxmertkitのデモ:ソーシャルメディア てっとり早くワクワクしたい人は、3つ目の「Maxmertkitのデモ:CSS3アニメーション」をご覧ください。 Maxmertkitの特徴 SASSベースのオープンソースのフレームワーク CSS3アニメーションを使った演出効果 他のフレームワークとかぶらないネームスペース デザイン(カラー・サイズ)変更はテーマで簡単 Creed Creed(主義)のページではMaxmertの主な特徴が解説されています。例えばコードの簡
表示サイズによって正方形のユニットが最適に構成される、Media Queriesを使ったフレームワークを紹介します。 IE8以下のMedia Queries非サポートブラウザにもスクリプトで対応しています。 Fluid Squares V2 [ad#ad-2] Fluid Squaresの主な特徴 正方形のユニットを使った、HTML5ベースの可変グリッドのフレームワーク。 Media Queriesで表示サイズによって、カラム数が増減、フォントサイズも調整。 モバイル ファーストで、小さいディスプレイのためにCSSを記述。 最近のモダンブラウザだけでなく、iOS, Android, BlackBerryなどにも対応。 IEなどMedia Queries非サポートブラウザには「css3-mediaqueries-js」で対応。 Fluid Squaresのデモ カラム数は1, 2, 3, 4
CSSのキャッシュ対策 クロスブラウザ対応の角丸、ボックスシャドウ、不透明 ショートハンドCSS、再利用可能なclass ページ下部に固定表示されるSticky Footer CSS(Reset関連) リセットはHTML5ベースのEric Meyer's Reset Reloaded フォントのノーマライゼーション Webkit系ブラウザのフォントのスムージング フォーススクロールバー ラベルの一列化 クリック可能なインプット要素 スクリーンリーダー対応 IE7のイメージリサイジング 印刷時のスタイル X(HTML) クリーンなコード構造 コンテンツ幅は940px F型レイアウト 古いバージョンのIEからイメージツールバーの削除 最新のIEのレンダリングエンジン jQuey 1.5.2ベース(1.4.4も可) ページ上部へスムーズにスクロール HTML5のプレースホルダー機能 ナビゲーショ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く