title標(biāo)簽
說明：定義一個(gè)文檔級(jí)別的標(biāo)題，這個(gè)標(biāo)題會(huì)在瀏覽器輸入欄上方顯示。
屬性：暫無
用法：<title>菜鳥教程 - 學(xué)的不僅是技術(shù)，更是夢(mèng)想！</title>
meta標(biāo)簽
說明：定義文檔的元信息，不同的屬性，標(biāo)記著不同的元內(nèi)容。
屬性：
1.charset屬性定義文檔的編碼方式，未聲明可能會(huì)出現(xiàn)亂碼。
取值：UTF-8,GBK
2.name屬性定義關(guān)于SEO的元信息，配合content屬性使用。
取值：冒號(hào)前為name屬性的值,冒號(hào)后為content屬性的值
1.description:文本值，
2.keywords:文本值，以逗號(hào)隔開
3.author:文本值(名字和郵箱，以逗號(hào)隔開)
4.robots:待補(bǔ)充
5.viewport:代補(bǔ)充
3.http-equiv屬性定義等同于http頭部的元信息，配合content屬性使用。
取值：冒號(hào)前為name屬性的值,冒號(hào)后為content屬性的值
1.content-type:UTF-8,GBK
2.X-UA-Campability:ie-edge,chrome-1
3.refresh:刷新間隔(秒)[,跳轉(zhuǎn)地址(絕對(duì)地址或相對(duì)地址)]
4.content屬性不能單獨(dú)使用，需和前面兩個(gè)屬性配合使用。
用法一：
<!-- 這是html5的寫法，也有html4.0.1的寫法，推薦這種寫法 -->
<meta charset="UTF-8">
用法二：
<!-- 文檔描述，會(huì)被搜索引擎顯示在搜索頁面中。 -->
<meta name="description" content="絕彈一個(gè)博客">
<!-- 文檔關(guān)鍵字，關(guān)鍵字之間以逗號(hào)隔開，搜索引擎根據(jù)該關(guān)鍵字分類收錄。 -->
<meta name="keywords" content="html,css,javascript,個(gè)人博客">
<!-- 文檔作者，由名字與郵箱組成，中間以逗號(hào)隔開。-->
<meta name="author" content="juetan,952222@163.com">
<!-- 搜索機(jī)器人的搜索權(quán)限，具體權(quán)限看這里: -->
<meta name="robots" content="index,flow">
<!-- 視圖端口，主要針對(duì)移動(dòng)端 -->
<meta name="viewport" content="width=device-width,inite-scale=1.0">
用法三：
<!-- 文檔編碼，這是html4.0.1的寫法，推薦上述html5的寫法 -->
<meta http-equiv="content-type" content="text/html,charset=UTF-8">
<!-- 瀏覽器兼容，告訴瀏覽器選擇什么樣的版本渲染文檔 -->
<meta http-equiv="X-UA-campability" content="IE=edge,chrome=1">
<!-- 文檔刷新，由間隔時(shí)間(秒)和跳轉(zhuǎn)地址組成，中間以逗號(hào)隔開 -->
<meta http-equiv="refresh" content="5,https://www.juetan.cn">
link標(biāo)簽
說明：定義文檔所鏈接的外部資源，按屬性值的不同，鏈接不同的資源。
屬性：
1.rel屬性定義文檔與外部資源的關(guān)系。
值：icon,stylesheet,author,alternate,archives,bookmark,external,first
last,help,license,next,nofollow,norefere,pingback,prefetch,prev,search
sidebar,tag,up
2.media屬性定義資源在什么設(shè)備上加載。
取值：以下組合
1.運(yùn)算符：and not ,
2.設(shè)備：all,screen,handheld,aural,braile,projection,print,tty,tv
3.取值:width,height,device-width,device-height,orientation,aspect-ratio
device-aspect-ratio,color,color-index,monochrome,resolution,scan,grid
3.src屬性定義資源的地址，文本值。
<!-- 引入一個(gè)文檔圖標(biāo)，該圖標(biāo)與文檔標(biāo)題一同顯示在瀏覽器輸入欄上方 -->
<link rel="shortcut icon" src="favicon.ico">
<!-- 引入一個(gè)外部樣式表，可根據(jù)media屬性在特定設(shè)備上引入該樣式表 -->
<link rel="stylesheet" media="screen and width>768px" src="/style.css">
style標(biāo)簽
說明：定義一個(gè)內(nèi)聯(lián)樣式表，作用在該文檔之內(nèi)。
屬性：暫無
用法：
<style>
h1 {
color:red
}
</style>
script標(biāo)簽
說明：定義腳本，作用在該文檔之內(nèi)。
屬性：
1.type屬性定義腳本的類型，非以下值會(huì)被當(dāng)做數(shù)據(jù)塊。
值：text/[javascript,ecmascript],application[javascript,ecmascript],module
2.src屬性定義腳本的來源地址，文本值。
3.defer屬性定義腳本在文檔解析后，DOMContentload前觸發(fā)，布爾值。
4.async屬性定義是否異步執(zhí)行腳本，布爾值。
用法：
<!-- 引入外部腳本 異步加載 -->
<script scr="index.js" async></script>
<!-- 定義內(nèi)部腳本 延遲解析 -->
<script defer>
alert("hello,world!");
</script>
附錄：
<!DOCTYPE html> <!-- 頭部標(biāo)簽(4個(gè))，以下標(biāo)簽分類，僅方便個(gè)人記憶，并非官方給出，暫時(shí)先列出標(biāo)簽，以后再慢慢補(bǔ)上 -->
<html lang="zh-cmn-Hans"> <!-- 中文漢字 -->
<head>
<!-- 字符編碼(html5寫法) -->
<meta charset="UTF-8">
<!-- 字符編碼(html4.0.1寫法) -->
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<!-- 頁面標(biāo)題 -->
<title>Title of this page</title>
<!-- 兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<!-- 移動(dòng)設(shè)備 -->
<meta name="viewport" content="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
<!-- 頁面描述 -->
<meta name="description" content="絕彈小站 - 正在學(xué)習(xí)前端的個(gè)人博客"/>
<!-- 頁面關(guān)鍵詞 -->
<meta name="keywords" content="前端,Html學(xué)習(xí),Css學(xué)習(xí),Js學(xué)習(xí),個(gè)人博客"/>
<!-- 網(wǎng)頁作者 -->
<meta name="author" content="juetan, contact@juetan.cn"/>
<!-- 搜索引擎 -->
<meta name="robots" content="index,follow"/>
<!-- 頁面刷新 -->
<meta http-equiv="refresh" content="5;https://www.juetan.cn">
<!-- 網(wǎng)頁圖標(biāo) -->
<link rel="shortcut icon" href="/favicon.ico">
<!-- 外部樣式表 -->
<link rel="stylesheet" media="" href="/css/index.css">
<!-- 外部腳本 -->
<script src="/js/index.js"></script>
<!-- 內(nèi)部樣式表 -->
<style>div {background-color:red}</style>
<!-- 內(nèi)部腳本 -->
<script>document.ready(function(){alert("hello,world");});</script>
</head>
<body>
</body>
</html>
