1.開發者文檔

• W3C官網： www.w3c.org

• W3School： www.w3school.com.cn

• MDN： developer.mozilla.org —— 推薦。

2.排版標簽

????????(1). h1 最好寫一個， h2~h6 能適當多寫。

????????(2). h1~h6 不能互相嵌套，例如： h1 標簽中最好不要寫 h2 標簽了。

????????(3). p 標簽很特殊！它里面不能有： h1~h6 、 p 、 div 標簽（暫時先這樣記，后面會說規律）。

3.語義化標簽

• 概念：用特定的標簽，去表達特定的含義。
• 原則：標簽的默認效果不重要（后期可以通過CSS隨便控制效果），語義很重要！
• 舉例：會與 h1?標簽，效果是文字很大（不重要），語義時網頁主要內容（很重要）。
• 優勢：
  • 代碼結構清晰可讀性強。
  • 有利于SEO（搜索引擎優化）。
  • 方便設備解析（如屏幕閱讀器、盲人閱讀器等）。

4.塊級元素和行內元素

? ? ? ? (1).塊級元素：獨占一行（排版標簽都是塊級元素）。

? ? ? ? (2).行內元素：不獨占一行。

? ? ? ? (3).使用原則：

? ? ? ? ? ? ? ? (1.塊級元素 中能寫行內元素和塊級元素。

? ? ? ? ? ? ? ? (2.行內元素 中能寫行內元素，但不能寫塊級元素。

? ? ? ? ? ? ? ? (3.一些特殊規則：

? ? ? ? ? ? ? ? ? ? ? ? ①h1~h6不能互相嵌套

????????????????????????②p中不要寫塊級元素

5.文本標簽_常用標簽

? ? ? ? (1).用于包裹：詞匯、短語等。

? ? ? ? (2).通常寫在排版標簽里。

? ? ? ? (3).排版標簽更宏觀（大段的文字），文本標簽更圍觀（詞匯、短語）。

? ? ? ? (4).文本標簽通常都是行內元素。

6.文本標簽_不常用的

備注：

? ? ? ? 1.這些不常用的文本標簽，編碼時不用過于糾結。

? ? ? ? 2.blockquote 與 address?是塊級元素，其他的文本標簽，都是行內元素。

? ? ? ? 3.有些語義感不強的標簽，很少使用，例如：

? ? ? ? ? ?small、b、u、q、blockquote

????????4.HTML的標簽太多了！記住那些：重要的、語義感強的標簽即可；截至目前，有這些：

? ? ? ? h1~h6、p、div、em、strong、span

7.圖片標簽

? ? ? ? (1)基本使用

????????總結：

1.像素(px)是一種單位。

2.盡量不同時修改圖片的寬高，可能會造成比例失調。

3.暫且認為img是行內元素。

4.?alt 屬性的作用：

• 搜索引擎通過 alt 屬性，得知圖片的內容。
• 當圖片無法展示時候，游戲瀏覽器會呈現 alt 屬性的值。
• 盲人閱讀器會朗讀 alt 屬性的值

? ? ? ? (2).路徑的分類

? ? ? ? ? ? ? ? (1.相對路徑：以當前位置作為參考點，去建立路徑。

已有路徑	符號	含義	舉例
	./	同級	引入【怪獸.jpg】： <img src="./怪獸.jpg">
	/	下一級	引入【喜羊羊.jpg】： <img src="./a/喜羊 羊.jpg">
	../	上一級	引入【奧特曼.jpg】： <img src="../奧特曼.jpg">

?注意：

• 相對路徑中的 ./ 可以省略不寫。

• 相對路徑依賴的是當前位置，后期若調整了文件位置，那么文件中的路徑也要修改。

? ? ? ? ? ? ? ? (2.絕對路徑：以根位置作為參考點，去建立路徑。

????????????????????????1. 本地絕對路徑： E:/a/b/c/奧特曼.jpg?

????????????????????????2. 網絡絕對路徑： http://www.w3c.org/xxxx/xxxx/logo.png?

? ? ? ? 注意：

? ? ? ? ? ? ? ? 1.使用本地絕對路徑，一旦更換設備，路徑處理起來比較麻煩，所以很少使用。

? ? ? ? ? ? ? ? 2.使用網絡絕對路徑，確實方便，但要注意：若服務器開啟了防盜鏈，會造成圖片引入失敗。