關於標籤分類，標籤分類

關於標籤分類，標籤分類

學習了前端才知道，原來我們使用的標籤也是有分類的呢。具體是分為塊/內嵌/內嵌塊，下面我們來看看塊/內嵌/內嵌塊的標籤都有些什麼各自的特點。

首先是塊標籤

　　塊:

              1. 獨佔一行顯示

              2. 支援所有的樣式

              3. 不設定寬度，寬度撐滿父級的空間

 

其次是內嵌標籤

　　內嵌:

              1. 可以在一行顯示

              2. 不支援寬高，上下的margin，上下padding支援的也有問題

              3. 代碼換行會解析出一個空格(字型和字型大小，可以控制空格大小)

              4. 寬度由內容撐開

還有我們的內嵌塊標籤呢，內嵌塊標籤是集合了塊標籤的支援寬高等樣式，不設定寬高由內容撐開，也支援內嵌的獨佔一行特點，代碼換行會解析一個空格。個人覺得使用內嵌塊來布局頁面，其實是挺方便的額。只是內嵌塊的元素在一行顯示，兩個元素之間是會有一些間隙，這些間隙需要在使用時解決一下的。

　　內嵌塊:

              1. 可以在一行顯示

              2. 支援寬高

              3. 代碼換行會解析出一個空格

              4. 不設定寬度的時候，寬度由內容撐開

 當然，這三種類型的元素並不是只能用作被初始定義的類型，我們還可以通過 display 這一樣式來根據自我的要求來轉換的呢。

常用的塊標籤: div、h1-h6、header、nav、section、article、aside、footer、dl、dt、dd、ol、ul、li、p、form

常用的內嵌標籤:a、span、strong、mark、time、em、label

常用的內嵌塊標籤: img、input、buttom、textarea、select

 

標籤嵌套規範：

    1. a標籤中 不能包含a標籤

       2. 內嵌標籤中不能包含塊標籤

       3. 部分塊標籤中 也不能再包含塊標籤: p, h1-h6, dt

       4. 注意以下幾種嵌套是固定的:

              ul li

                     ul下只能包含li，li的父級也只能是ol或ul，當然li中可以隨意放置

              ol li

                     ol下只能包含li，li的父級也只能是ol或ul，當然li中可以隨意放置

              dl dt dd

                     dl下只能包含dt和dd，dt,dd的父級也只能是 dl，當然dd中可以隨意放置

       5. 一般建議，塊和塊並列，內嵌和內嵌並列