HTML基本結構 HTML初識 HTML(Hyper Text Markup Language):超文本標記語言 所謂超文本，有2層含義： 它可以加入圖片、聲音、動畫、多媒體等內容（超越文本限制 ） 它可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接（超級鏈接文本）。 「HTML骨架格式」 ...
HTML基本結構
HTML初識
HTML(Hyper Text Markup Language):超文本標記語言
所謂超文本，有2層含義：
- 它可以加入圖片、聲音、動畫、多媒體等內容（超越文本限制 ）
- 它可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接（超級鏈接文本）。
「HTML骨架格式」
<!-- 頁面中最大的標簽 根標簽 -->
<html>
<!-- 頭部標簽 -->
<head>
<!-- 標題標簽 -->
<title></title>
</head>
<!-- 文檔的主體 -->
<body>
</body>
</html>
「團隊約定大小寫」
- HTML標簽名、類名、標簽屬性和大部分屬性值統一用小寫
「HTML元素標簽分類」
- 常規元素(雙標簽)
- 空元素(單標簽)
常規元素(雙標簽)
<標簽名> 內容 </標簽名> 比如<body>我是文字</body>
空元素(單標簽)
<標簽名 /> 比如 <br />或<br>
「HTML標簽關係」
嵌套關係:父子級包含關係併列關係:兄弟級併列關係-
如果兩個標簽之間的關係是嵌套關係，子元素最好縮進一個tab鍵的身位（一個tab是4個空格）。如果是併列關係，最好上下對齊。
文檔類型<!DOCTYPE >
「文檔類型」用來說明你用的XHTML或者HTML是什麼版本。<!DOCTYPE html>告訴瀏覽器按照HTML5標準解析頁面。
頁面語言lang
lang指定該html標簽內容所用的語言
<html lang="en">
en 定義語言為英語 zh-CN定義語言為中文
「lang的作用」
- 根據根據lang屬性來設定不同語言的css樣式，或者字體
- 告訴搜索引擎做精確的識別
- 讓語法檢查程式做語言識別
- 幫助翻譯工具做識別
- 幫助網頁閱讀程式做識別
字元集
行字元編碼，以便電腦能夠識別和存儲各種文字。
- UTF-8是目前最常用的字元集編碼方式
- 讓 html 文件是以 UTF-8 編碼保存的， 瀏覽器根據編碼去解碼對應的html內容。
<meta charset="UTF-8" />
「meta viewport的用法」
通常viewport是指視窗、視口。瀏覽器上(也可能是一個app中的webview)用來顯示網頁的那部分區域。在移動端和pc端視口是不同的，pc端的視口是瀏覽器視窗區域，而在移動端有三個不同的視口概念：佈局視口、視覺視口、理想視口
meta有兩個屬性name 和 http-equiv
name屬性的取值
- keywords(關鍵字) 告訴搜索引擎，該網頁的關鍵字
- description(網站內容描述) 用於告訴搜索引擎，你網站的主要內容。
- viewport(移動端的視窗)
- robots(定義搜索引擎爬蟲的索引方式) robots用來告訴爬蟲哪些頁面需要索引，哪些頁面不需要索引
- author(作者)
- generator(網頁製作軟體）
- copyright(版權)
http-equiv有以下參數
http-equiv相當於http的文件頭作用，它可以向瀏覽器傳回一些有用的信息，以幫助正確和精確地顯示網頁內容
- content-Type 設定網頁字元集(Html4用法，不推薦)
- Expires(期限) ,可以用於設定網頁的到期時間。一旦網頁過期，必須到伺服器上重新傳輸。
- Pragma(cache模式),是用於設定禁止瀏覽器從本地機的緩存中調閱頁面內容，設定後一旦離開網頁就無法從Cache中再調出
- Refresh(刷新),自動刷新並指向新頁面。
- cache-control（請求和響應遵循的緩存機制）
<meta name="viewport" content="width=device-width, initial-scale=1.0">
