HTML5 の構造とセマンティクス (2): Structure_html5 チュートリアルのスキル

WBOY
リリース: 2016-05-16 15:51:47
オリジナル
1190 人が閲覧しました

たとえ整形式の HTML ページであっても、構造が不足しているために処理が難しい場合があります。セクションがどのように分割されているかを確認するには、見出しのレベルを分析する必要があります。サイドバー、フッター、ヘッダー、ナビゲーション バー、メイン コンテンツ領域、および個々の記事はすべて、共通の div 要素で表されます。 HTML 5 では、特にこれらの一般的な構造を識別するために、いくつかの新しい要素が追加されています。
· セクション: これは本の章またはセクションであり、実際には HTML 4 で独自のタイトルを持つものであれば何でも
· ヘッダー: head 要素とは別にページに表示されるヘッダー。同じ
· footer: フッター; 電子メールに署名を表示できます
· nav: 他のページへのリンクのセット
· Article: ブログ、雑誌、記事まとめなどの記事。
上部にヘッダー、下部にフッター、いくつかの記事、ナビゲーション領域、サイドバーがある典型的なブログのホームページについて考えてみましょう。典型的なブログ ページのコード 1 を参照してください。


Mokka mit Schlag







"/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/">
サセックス郡に春が来る (そして去っていく)



昨日、私はブルックリンバードクラブに参加して、ニュージャージー州西部への
毎年恒例の旅行、特に比較的最近発見されたホットスポットであるハイパー
腐植土
から始まりました。午前7時30分に現場に到着したときは、気持ちの良い冬の朝でした。
午前10時頃には春になり、


には初夏になりました。



"/blog/birding/2007/04/23/but-does-it-count-for-your-life -list/"> でも、それはあなたの人生リストに含まれますか?


これで href="http: //www.wired.com/science/discoveries/news/ 2007/04/cone_sf">インターネット経由の野鳥観察
。私はまだテストできていません (20 ユーザー
どうやら限界のようです) しかし、これは確かにクールです。
個人的には、これが実際にフィールドに出ている
に少しでも置き換えられるとは想像できません。
一方、私は常に
双眼鏡を安定して持つことができなくなったり、公園に行くことができなくなった先輩野鳥観察者たちに会うのはとても
悲しいことです。
少なくとも 1 人は、これが何らかの興味を持っているのではないかと想像できます。年老いた野鳥観察者は、
あまり外に出られなくなって以来、テレビで大活躍しましたが、これは間違いなく
それを上回ります。











インデントが正しくても、これらのネストされた div は依然として非常に混乱しているように感じられます。 HTML 5 では、これらの要素をセマンティック要素に置き換えることができます。HTML5 で書かれた典型的なブログ ページについては、コード 2 を参照してください。


Mokka mit Schlag



Mokka mit Schlag





"/blog/birding/2007/04 /23/spring-comes-and-goes-in-sussex-county/">
サセックス郡に春が来る (そして去っていく)


昨日、私はブルックリン バード クラブに参加しましたニュージャージー州西部への
毎年恒例の旅行、特に比較的最近発見されたホットスポットであるハイパー
腐植土への旅行
は、私たちが現場
に7時半に到着したときから始まりました。午前10時
頃から春に進み、




"/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/">
でも、それはあなたの人生リストに含まれますか?


href="http://www.wired.com/science/discoveries/news/
2007/04/cone_sf">インターネット経由で野鳥観察ができるようです。私
はまだテストできていませんが (どうやら 20 ユーザー
制限があるようです)、これは確かに素晴らしいです。
個人的には、これが実際にリリースされる
に代わるとは想像できません。
その一方で、双眼鏡をしっかり持つことができなくなったり、公園に行くことができなくなった先輩野鳥観察者たちに会うのは
いつもとても悲しいことです。
少なくとも一人の年配の野鳥観察者がテレビで大活躍したのに、
もうあまり外出できなくなってしまったのは間違いなく
です。






著作権 2007 Elliotte Rusty Harold




これで div は必要なくなりました。 class 属性を自分で設定する必要はなくなり、各部分の意味は標準の要素名から推測できます。これは、オーディオ ブラウザ、モバイル ブラウザ、その他の非標準ブラウザにとって特に重要です。
(続く)
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート