HTML額外標籤

less than 1 minute read

因為學習HTML在一般的標籤上並沒有遇到什麼問題,所以就不多做說明。 直接進入比較容易混淆不理解的地方,就是HTML的額外標籤。

HTML的額外標示


一般常見的標籤,很容易理解,所以特別針對HTML的額外標示來加強需具備的Web知識。

1. DOCTYPE

html經歷了不同版本,所以每個網頁一開始都應該告訴瀏覽器使用的html版本。 <!DOCTYPE html>

2. 註解

html裡的註解以表示

3. id屬性

a) 每個HTML屬性都可以使用id屬性,將某元素「獨立」辨識出來,也就是說它是唯一的。 b) 同一個頁面上的兩個元素不能有相同的id屬性,否則該值就不再唯一。 c) 學習javascript時,id屬性可以讓程式碼與特定元素互動。 d) 屬性是全域變數(global attribute)。

4. class屬性

如果你想做的並非獨立辨識文件中的單一元素,而是選取特定的幾個元素,對這幾個元素進行「分組」的動作,這樣一來你就可以一次美化使用相同class屬性的所有成員。例如:你想區別內部連結與外部連結。就可以使用class屬性來標示它們。

quote 在任何屬性上的class屬性都可以套用相同的值。

5. Block(區塊元素)

有些元素會在瀏覽器視窗另起一行,稱為block level的元素。。

6. Inline(行內元素)

有些元素會跟鄰近元素保持在同一行,這些稱為行內元素。

7. div

元素<div>可以將一組元素全組起來,成為一個block level的方塊。 因為div可以用在很多地方,在</div>後面加一個註解,可以大大提昇可讀性。 使用<div>元素來容納頁面的不同區域,可以讓管理原始碼的工作更容易。

8. span

元素<span>的作用就像<div>元素的inline版本。也就是它是一個inline level的元素。

9. iframe

元素<iframe>就像網頁上的一個小窗戶,透過這個小窗戶你可以看到其他網頁。常見的像是youtube或是google map都是這種用法。

10. meta

元素<meta>標示位在<head>元素內,包含網頁相關資訊。 有以下幾個properties description: 網頁的描述,有時候會在搜尋結果中出現。 robots: 此屬性標明搜尋引擎是否要將此頁面加到搜尋結果中。

11. 其他

一些不受到html5支援的額外標示就不在此寫出,需要用到的時候再去查詢即可。

Leave a Comment