HTML入門之——結構，經常使用標籤及其屬性，再加上語義化

時間 2019-11-08

標籤 html 入門結構經常使用標籤及其屬性再加語義欄目 HTML 简体版

原文原文鏈接

一，HTML簡介（來源HTML百度百科）

HTML：超文本標記語言，是指可以包含連接，圖片，程序，視頻等非文字元素的頁面html

二，HTML，XML，XHTML之間有什麼區別

HTML：超文本標記語言，語法比較鬆散，書寫格式不是那麼規範，用於展現數據；
XML：可擴展標記語言，書寫格式相似於HTML，可是標籤都是自定義，且書寫格式嚴格，用於傳輸數據；
XHTML：可擴展超文本標記語言，基於XML，書寫格式很是嚴格的HTML模式，用於展現數據；

之間的區別： 1.XML用於傳輸數據； 2.HTML和XHTML用於展現數據； 3.相較於XHTML，HTML的書寫格式並不那麼嚴謹，其它的和HTML4.0幾乎同樣；前端

三：HTML的主要結構

<!DOCTYPE html>                        
    <html>                                       
        <head>
        </head>
        <body>
        </body>
    </html>
複製代碼

<!DOCTYPE html>：聲明文檔類型，用於告訴瀏覽器以什麼樣的方式對該文檔進行渲染，若是沒有這個聲明則使用怪異模式進行渲染，有則使用標準模式進行渲染；
<html>：頁面的根標籤：限定了頁面的開始和結束，在這個標籤包裹<head>和<body>標籤；
<head>：頭部標籤，用於定義文檔的頭部，包裹該文檔的頭部元素，用於引入腳本、樣式、包裹元標籤等；
<body>：內容標籤，用於展現的內容都寫在這個標籤之內，定義文檔的主體；

注意點：瀏覽器

標籤閉合：例如<html>這個標籤，閉合就用</html>，也就是添加斜槓完成，除了<html>標籤外，其它的除了自閉合標籤和空標籤之外的標籤均可以使用這種方式進行閉合；
添加語言：在<html>標籤內，能夠添加屬性lang屬性來告訴瀏覽器當前文檔使用的是何種語言，例如： lang = "en"就是告訴瀏覽器當前文檔使用的是英語； 3.書寫：標籤的書寫所有使用小寫英文；

四：HTML書寫規範

行級元素不要包裹塊級元素：例如<span><div></div></span>這樣是錯誤的，可是塊級元素能夠包裹行級元素；
標籤閉合：例如：<p></p>,<span></span>；
標籤所有用英文小寫書寫；
標籤用尖括號進行包裹：<標籤名>；

五：關於`<meta>`標籤

在標籤內，你會見到一個叫<meta>的標籤，例以下面這樣：編輯器
```
<head>
      <meta>
</head>
複製代碼
```

上面的<meta>就是文檔的元標籤，它能夠經過一些屬性提供的值來標示這個文檔的元信息，例如解碼方式，關鍵詞等，它是一個自閉合標籤，不須要閉合，它不提供任何文檔的內容；佈局

<meta>標籤的經常使用屬性介紹： 1.charset：charset屬性有一個值，這個值填寫的是編碼方式，例如：charset = "UTF-8"就是標明該文檔的編碼方式是 UTF-8，其它的編碼方式還有gbk，Unicode等； 2.http-equiv：http-equiv：該屬性能夠向瀏覽器傳回一些有用的信息，以幫助正確和精確地顯示網頁內容，要與content屬性一塊兒使用，正確的格式是：http-equiv = "參數"，例如：http-equiv = "X-UA-Compatible"； 3.content：用於標示數據傳輸中的值； 4.name：name屬性要與content屬性一塊兒使用，name屬性經常使用的值有： ①：viewport：例如：<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> viewport這個值用來限定用戶是否能縮放或放大頁面，最大和最小多少； ②：keywords：例如：<meta name="keywords" content="前端飢人谷"> keywords值顧名思義，是用來告訴瀏覽器這個頁面的關鍵詞是什麼，方便搜索引擎進行關鍵詞抓取； ③：description：例如：<meta name="description" content="最有愛的前端學習社區"> description值用來告訴搜索引擎這個頁面大致內容的描述，以及搜索出來檢索顯示的信息；學習
常見問題之——內容文字變成亂碼例子：字體

1.出現的緣由：在<meta>標籤內的編碼方式是UTF-8