FC2ブログ

HTML5と画面分割

HTML5では
以前はdivタグでやっていた画面分割を
新しく定義された要素で分割が可能

articleタグで
画面の左側

sectionタグで
画面中央

asideタグで
画面の右側

ちなみに、画面の中央には
ブログ記事とかを書いたりするので
section要素でマークアップしている

このセクションという仕組みは
HTML5から追加されたもので
セクションを本に例えると
本の章とか節みたいになる

ちなみに、sectionの中に
さらに複数のsectionがあっても問題ない

セクション内では
HTMLでおなじみの見出しをつける
h1~h6タグが使える

本文と関係のある補足的なコンテンツ
例えば、ブログ記事の関連リンクとか
自作アプリとか、開発したもののバナーとか
そういうのは
article要素じゃなくて
右側に表示できる
aside要素のところに書く

あとは、最後にフッターをマークアップ

フッターには
コピーライトとか
よく一番下に書いてあるのを書くところ

ヘッダー
コンテンツ
フッター
の組合せは
jQuery mobileでも使うので
覚えておくと便利

ちなみに、
ヘッダーは見出し
コンテンツは記事本文
フッターは下にかくもの
と考えるとわかりやすい

スマホ向けサイトをみると
わかりやすい
スポンサーサイト



コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック