文章編輯時間：2018-06-12
1. HTML結構
一個最基本的HTML結構代碼
<!DOCTYPE html> //文檔申明(告訴瀏覽器使用哪個HTML版本進行解析)，不是HTML元素哦??
<html> //HTML元素--頂級元素或者根元素（只能包含head和body元素）
<head> // head元素 （頁面的通用信息都放在head元素之中--也稱為元數據）用來描述html文檔本身的信息
<title>基本HTML結構</title>
</head>
<body> // body元素用來存放頁面的內容
<h1>H1是一級標題</h1>
<p>p是一段文本段落</p>
</body>
</html>
這段代碼點擊這里可查看代碼在瀏覽器中呈現的效果如下截圖：codepen了解一下
基本HTML結構
2. 深入了解head
head元素用于定義網頁的常規信息和元數據，在網頁中不可見，但很重要
<head>元素三大重要功能
1.描述網頁的基本信息
<meta charset="utf-8">//網頁的編碼格式
<meta http-equiv="X-UA-Compatible" content="ie=edge">//IE瀏覽器版本渲染設置(網頁的兼容性問題--指定IE的版本)
<title>標題</title>//網頁標簽顯示的標題
<meta name="viewport" content="width=device-width, initial-scale=1">//視窗設置
<meta name="keyWords" content=" head元素">
<meta name="description" content="深入了解head元素">//搜索引擎優化相關內容
2.指向渲染網頁需要其它文件鏈接
<link rel="shortcut icon" href="favicon.ico">//網頁選項卡圖標
<link rel="stylesheet" href="style.css">
<script src="app.js"> </script>
3.各大廠商根據自己需要定制
<!-- 360 瀏覽器 -->
<meta name="renderer" content="webkit"> <!-- 默認webkit內核 -->
<meta name="renderer" content="ie-stand"> <!-- 默認IE標準模式 -->
<meta name="renderer" content="ie-comp"> <!-- 默認IE兼容模式 -->
<!-- QQ 分享 -->
<meta itemprop="name" content="這是分享的標題"/>
<meta itemprop="name" content="logo.png" />
<meta name="description" itemprop="description" content="這是要分享的內容" />
<!-- iOS -->
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
你要的資料在這里哦
參考資料傳送門??請進門
上一章節：WEB的歷史
下一章節： HTML元素、注釋、屬性、常用基本元素
