官术网_书友最值得收藏!

3.1 認識HTML5文檔結構

為了幫助讀者更好地理解與認識HTML5文檔,也為了讓讀者能夠順利讀懂HTML5網頁代碼的準確意思,下面給出一個詳細的、符合標準的HTML5文檔結構代碼,并在代碼中進行了注釋。

<!doctype html>
<!--聲明文檔結構類型-->
<html>
<!--聲明文檔區域-->
<head>
<!--文檔的頭部區域-->
<meta charset="utf-8">
<!--文檔的頭部區域中元數據區的字符集定義,utf-8表示國際通用的字符集編碼格式-->
<title>網頁標題</title>
<!--文檔的頭部區域的標題-->
</head>
<body>
<!--文檔的主體內容區域-->
<header>HTML5文檔的頭部區域</header>
<nav>HTML5文檔的導航區域</nav>
<section>HTML5文檔的主要內容區域
   <aside>HTML5文檔的主要內容區域的側邊導航或菜單區</aside>
   <article>HTML5文檔的主要內容區域的內容區
      <section>以下是一個section和article的嵌套
         <aside></aside>
         <article>
            <header>嵌套內容的標題</header>
HTML5+CSS3+jQuery移動網站開發從入門到精通HTML5文檔的嵌套區域,可以對某個article區域進行頭部和腳部的定義。這樣做,可以有非常清晰和嚴謹的文檔目錄結構關系。
            <footer>嵌套內容的頁腳</footer>
         </article>
      </section>
   </article>
</section>
<footer>HTML5文檔的頁腳區域</footer>
</body>
</html>

當然,并不是每個HTML5文檔都需要包含以上代碼中的所有部分,一個最簡單的HTML5文檔需要的內容如下。

<!DOCTYPE html>

該代碼聲明了HTML文檔的類型,除了字母的大小寫可以任意變化外,其他的內容都不能變動。

HTML5文檔擴展名為.html或.htm。現在主流瀏覽器都能夠正確解析HTML5文檔,如Chrome、Firefox、IE9+和Safari等。下面是一個最基礎的HTML5文檔代碼。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5</title>
</head>
<body>
</body>
</html>

HTML5文檔以<!doctype html>開頭,這是一個文檔類型聲明,必須位于HTML5文檔的第一行,該行代碼用來告訴瀏覽器或其他分析程序它們所查看的文檔類型。

<html>標簽是HTML5文檔的根標簽,緊跟在<!doctype html>之后,<html>標簽支持HTML5全局屬性和manifest屬性,manifest屬性主要在創建HTML5離線應用時使用。

<head>標簽是所有頭部元素的容器,位于<head>與</head>標簽之間的元素可以包含元信息、JavaScript腳本和CSS樣式表等。<head>標簽支持HTML5全局屬性。

<meta>標簽位于文檔的頭部,不包含任何內容。標簽的屬性定義了與文檔相關聯的名稱/值對,該標簽提供頁面的元信息,如針對搜索引擎的描述和關鍵詞。

<meta charset="utf-8">定義了HTML5文檔的字符編碼是utf-8。這里charset是<meta>標簽的屬性,而utf-8是該屬性的值。HTML5中的很多標簽都有屬性,從而擴展了標簽的功能。

<title>標簽位于<head>與</head>標簽之間,定義了HTML文檔的標題。該標簽定義了瀏覽器工具欄中的標題,設置頁面被添加到收藏夾時的標題和顯示在搜索引擎結果中的頁面標題。該標簽非常重要,在編寫HTML5文檔的時候一定要添加該標簽。<title>標簽支持HTML5全局屬性。

<body>標簽定義文檔的主體和所有內容,如文本、超鏈接、圖像、列表和多媒體等都包含在該標簽中。

主站蜘蛛池模板: 思茅市| 大理市| 玉溪市| 青海省| 清新县| 武义县| 南澳县| 大厂| 鹿邑县| 阿鲁科尔沁旗| 莫力| 东辽县| 禹城市| 大足县| 新源县| 绥芬河市| 河源市| 安顺市| 正安县| 长顺县| 汉源县| 德令哈市| 家居| 南开区| 太白县| 莱西市| 寿光市| 桐城市| 铜陵市| 泗洪县| 阿荣旗| 巩留县| 新乡县| 盘山县| 临洮县| 从化市| 准格尔旗| 平塘县| 肇州县| 美姑县| 积石山|