一、HTML5 文檔結構
<!DOCTYPE html> //文檔類型聲明
<html lang="zh-cn"> //表示 HTML 文檔開始
<head> //包含文檔元數據開始
<meta charset="utf-8"> //聲明字符編碼
<title>個人博客網站</title> //設置文檔標題
</head> //包含文檔元數據結束
<body> //表示 HTML 文檔內容開始
<a href="http://www.lmlblog.com">個人博客網站</a> //一個超鏈接元素(標簽)
</body> //表示 HTML文檔內容結束
</html> //表示 HTML 文檔結束
二、文檔結構解析
1.Doctype
文檔類型聲明(Document Type Declaration,也稱 Doctype)。它主要告訴瀏覽器所查看的文件類型。在以往的HTML4.01和XHTML1.0中,它表示具體的 HTML 版本和風格。而如今HTML5不需要表示版本和風格了。
<!DOCTYPE html> //不分區大小寫
2.html 元素
首先,元素就是標簽的意思,html元素即html標簽。html元素是文檔開始和結尾的元素。它是一個雙標簽,頭尾呼應,包含內容。這個元素有一個屬性和值:lang="zh-cn",表示文檔采用語言為:簡體中文。
<html lang="zh-cn"> //如果是英文則為 en
3.head 元素
用來包含元數據內容,元數據包括:<link>、<meta>、<noscript>、<script>、<style>、<title>。這些內容用來瀏覽器提供信息,比如link提供 CSS信息,script提供JavaScript信息,title提供頁面標題等。
<head>...</head> //這些信息在頁面不可見
4.meta 元素
這個元素用來提供關於文檔的信息,起始結構有一個屬性為:charset="utf8"。表示告訴瀏覽器頁面采用的什么編碼,一般來說我們就用utf8。當然,文件保存的時候也是utf8,而瀏覽器也設置utf8即可正確顯示中文。
<meta charset="utf-8"> //除了設置編碼,還有別的
5.title 元素
這個元素很簡單,顧名思義:設置瀏覽器左上角的標題。
<title>MAOLAI博客 | 關注互聯網和seo優化的個人博客網站</title>
6.body 元素
用來包含文檔內容的元素,也就是瀏覽器可見區域部分。所有的可見內容,都應該在這個元素內部進行添加。
<body>.../body>
7.a 元素
一個超鏈接,后面會詳細探討。
<a href="http://www.lmlblog.com">個人博客網站</a>
三、元素標簽探討
HTML是一種標記語言,“標記”或者叫“標簽”,書面上經常稱作為“元素”的東西是怎么構成的。
1.元素
元素就是一組告訴瀏覽器如何處理一些內容的標簽。每個元素都有一個關鍵字,比如<body>、<title>、<meta>都是元素。不同的標簽名稱代表不同的意義,后面將會涉及到段落標簽、文本標簽、鏈接標簽、圖片標簽等。
元素一般分為兩種:單標簽(空元素)和雙標簽。單標簽一般用於聲明或者插入某個元素,比如聲明字符編碼就用<meta>,插入圖片就用<img>;雙標簽一般用於設置一段區域的內容,將其包含起來,比如段落<p>......</p>。
2.屬性和值
元素除了有單雙之分,元素的內部還可以設置屬性和值。這些屬性值用來改變元素某些方面的行為。比如超鏈接:<a>中的href屬性,里面替換網址即可鏈接到不同的網站。當然一個元素里面可以設置多個屬性,甚至自定義屬性。
html控制標記的格式
(1)<標記名稱>單一型,無設置值的。如:<br> (2)<標記名稱 屬性="屬性值">單一型,有設置值的。如<hr= width="80%"> (3)<標記名稱>......</標記名稱>對稱型,無設置值。<title>.....</title> (4)<標記名稱 屬性="屬性值">......</標記名稱>對稱型,有設置值。如:<body bgcolor="red">....</body>
