HTML5 デザインと Modification_html5 チュートリアルスキルのいくつかのページ例を共有する-H5 チュートリアル-php.cn

HTML5 の新しいセマンティック要素を理解し、慣れるための最良の方法は、古典的な HTML ドキュメントを例として取り上げ、それを HTML5 の新しい要素で強化することです。以下は変換するページです。このページは非常に単純で、記事が 1 つだけ含まれています。

ApocalypsePage_Original.html、これは非常に標準化された形式のページであり、すべてのスタイルは外部スタイルシートから取得されます。

XML/HTML コードコンテンツをクリップボードにコピー

>
<html lang="zh- CN「>
<頭>
<meta charset="utf- 8">
<タイトル>地獄の黙示録タイトル>
<リンク rel="スタイルシート" href="ApocalypsePage_Original.css">
頭>
<ボディ>
<div class="ヘッダー" >
<h1>世界はどのように終わるのかh1>
<p クラス=「ティーザー」 >私たちが知っている人生の終わりを告げるシナリオp>
<p クラス="署名" >by Ray N. Carnationp>
div>
<div class="コンテンツ" >
<p><スパンクラス="LeadIn">現在span>、おそらくとても良い気分です。結局のところ、先進国の生活は快適です<スパンクラス="style1">—スパン>おそらく有史以来、平均的な人間よりも快適です。p>
<p>しかし、独りよがりになりすぎないでください。すべてがバラバラになる可能性のある恐ろしい方法がまだたくさんあります。この記事では、お気に入りのいくつかについて説明します。p>
<h2>マヤ終末期h2>
<p>懐疑派は、マヤ暦が単に新しい 5,126 年の時代に移行するだけだと示唆しています2012 年以降であり、実際に生命を終わらせる黙示録を予測するものではありません。しかし、大昔に滅びたマヤ人が他のすべてのことについて事実上間違っていたことを考えると、なぜこの件に関して彼らを信頼する必要があるのでしょうか?p>
<h2>ロボット乗っ取りh2>
<p>吸血鬼の乗っ取りやリビングデッドの乗っ取りほど恐ろしいものではありませんが、ロボットの反乱は今でも不穏な考えです。私たちはすでにテクノロジー機器の多さに圧倒されており、ビル・ゲイツですら、日本の奴隷が足首をつかんでひっくり返し、（適切なロボットの声で）「今、あなたのお父さんは誰ですか？」と尋ねる日を恐れています。 /p>
<h2>原因不明の特異点h2>
<p>宇宙がどのように始まったのかはわかりません。それはきっと今日だけで終わるわけではないし、もしかしたら反物質のパフとわずかなシュワシュワという音以外にエキサイティングなものは何もないかもしれない。p >
<h2>暴走する気候変動 h2>
<p>一部の人には無視されていますが、アル・ゴアの破滅の予言は今でも実現する可能性があります。もしそうなった場合、私たちは激しい嵐、広範な食料不足、無愛想なエアコン修理業者と戦わなければならないかもしれません。p>>
<h2>世界的流行h2>
<p>将来、致死性のウイルスが発生する可能性があります。病気の原因については予測が異なりますが、候補には、アフリカのジャングルのサル、バイオテロリスト、インフルエンザに感染した鳥や豚、未来から来た戦士、エイリアン人種、抗生物質を多用する病院、吸血鬼、CIA、国連などが含まれています。洗った芽キャベツ。情報源が何であれ、それは明らかに悪いニュースです。p>
div>
<div class="フッター" >
<p クラス=「免責事項」 >これらの終末論的な予測は、著者の見解を反映したものではありません。p>
<p>
<a href=「当社について。 html">会社概要a>
<a href=」免責事項。 html">免責事項a>
<a href="お問い合わせください。 html">お問い合わせa>
p>
<p>Copyright © 2014 p>
div>
ボディ>
html>