ホームページ >
記事 > ウェブフロントエンド > HTMLの
HTMLのタグの使い方
- php中世界最好的语言オリジナル
- 2017-11-22 17:17:235172ブラウズ
HTML5 より前のバージョンでは、Web ページのレイアウトに DIV タグを使用する習慣があるかもしれませんが、H5 では、DIV タグに基づいてヘッダー タグ要素が追加されます。これは、以前は head タグと呼ばれていました。 Web ページをレイアウト内のヘッダーに追加します。ヘッダー、コンテンツ、下部。計画に役立つ体系的なタグが追加されました。では、このヘッダー タグをどのように使用すればよいでしょうか。今日はそれをじっくり勉強してみます
「ヘッダー」はhtmlレイアウトでよく使われる名前であることは誰もが認識しているので、HTML5では新しいヘッダータグ要素が追加されました。 html5でヘッダーがlabel要素として追加される理由がわかります。
headerタグを直接使用する以外に、classやidをヘッダーに設定することもできます。
文法構造
headerタグ要素はpと同じように使用されます。始まりがあり、終わりがある。
構文:
<header>内容</header>
id や class を直接指定しないでください
<header>头部内容区</header>
id を設定
<header id=”p”>头部内容区</header>
class を設定
<header class=”p”>头部内容区</header>
特徴: DIV タグ要素と同じように、複数回使用でき、id または class も使用できますさまざまな場所にさまざまなスタイルを設定します。
互換性
header タグは HTML5 の新しいタグ要素であるため、古いバージョンのブラウザではサポートされていません。これをサポートするには、IE9 以降のブラウザと最新の Google Chrome が必要です。もちろん、360 ブラウザ、Baidu ブラウザ、Aoyou ブラウザなどの国内ブラウザはすべてシステムに付属の IE カーネルを使用するため、国内ブラウザは実際にはシステムに付属の IE バージョンと同じバージョンであるため、IE ブラウザ IE9 以降のバージョンは、HTML5 の新しいタグ要素と自然に互換性があります。
新旧DIVレイアウトの比較事例
DIV+CSSレイアウトとHTML5+CSSレイアウトを比較することでヘッダーの適用を観察し習得します。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>html5 Header标签实例</title>
<style>
/* 传统布局CSS */
#header{ width:300px; height:40px; background:#CCC}
/* HTML5布局样式 */
header{ width:400px; height:70px; color:#F00; background:#F5F5F5}
.color-000{ color:#000; background:#666}
</style>
</head>
<body>
<p id="header">我在传统p布局中</p>
<header>我在传统p布局中,必须在支持HTML5浏览器才能看到效果，
建议谷歌浏览器测试观察效果</header>
<header class="color-000">我颜色为黑色,背景为#666</header>
</body>
</html>1aa9e5d373740b65a0cc8f0a02150c53 タグの使用法はたくさんあります。さらに興味深い内容については、php 中国語 Web サイトその他 関連記事に注目してください。
関連記事:
以上がHTMLの