標籤需要怎麼使用

html 的
標籤需要怎麼使用

php中世界最好的语言原創: 2017-11-22 17:17:235215瀏覽

在HTML5之前的版本大家可能有用DIV標籤版面網頁的習慣，但H5在DIV標籤的基礎上增加了header標籤元素，也就是我們說的頭部標籤，以往我們在版面中常常把網頁分為頭部，內容，底部，現在已經有系統的標籤來幫我們規劃，也是方便了很多，那麼這個header標籤需要怎麼使用呢？今天我們就來好好的研究一下

正應為大家公認html佈局中對「header」為常用命名，所以在HTML5新增了個header標籤元素。可以這樣理解為什麼在html5中新增header為標籤元素。

除了直接使用header標籤外，也可以對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+以上瀏覽器、最新GoogleChrome等瀏覽器才能支援。當然國內360瀏覽器、百度瀏覽器、遨遊瀏覽器等瀏覽器均借用系統自帶IE內核，所以國內瀏覽器實際上與你係統自帶瀏覽器IE版本相同，所以你IE瀏覽器在IE9或以上版本自然相容HTML5新增標籤元素。

新舊DIV佈局比較案例

透過DIV+CSS佈局與HTML5+CSS佈局比較觀察並掌握對header應用。

<!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中文網其它相關文章！

html 的標籤需要怎麼使用

相關文章

html 的
標籤需要怎麼使用