HTML5學習_day02(4)--html常用标簽分類

标簽的分類：

注意：标簽可以利用display屬性來轉換标簽格式

        标簽類型轉換

        display:nlock;轉換成塊級标簽

        dispaly：inline-block;轉換成内斂塊級标簽

        display：inline;轉換成内斂标簽

        如：span标簽是内斂标簽不占行

<span >123</span>
		<span >345</span>
		<span >567</span>
		<span >789</span>
           

        效果：

        123345567789

        把span類型轉換塊級标簽試試看

<span style="display: block;">123</span>
		<span style="display: block;">345</span>
		<span style="display: block;">567</span>
		<span style="display: block;">789</span>
           

          效果  123345567789

        一 塊級标簽（block）

        1. <div>

        2. <p>段落标簽

        3. <h1>...<h6>标題

        4. <ol>(有序)  <ul>(無序)  <dl>(清單說明)

        5. <table>表格标簽

        6. <hr>水準線

        7. <form>表單

        8. <pre>格式預處理标簽( 如果一段文字輸入了換行 這個标簽就可以将源碼内容換行顯示在網頁上)

        特點：

        1.獨占一行

        2.元素寬高可設定

        3.支援所有的css樣式

        4.如果元素的寬高不設定，寬度預設是父級100%寬度

        5.塊級标簽預設高度0，如果有内容就是内容的高度

        6.如果塊級标簽内容裡面有内容，也設定了寬高，那麼高度以設定的高度（height）為準

        二 内斂(行内)标簽(linline)

        1. <span> 無語意标簽

        2. <a>超連結

        3. <br>換行

        4. <i>文字斜體标簽

        5. <em>, <strong>文字加粗,strong比em加粗更強一點

        6. <sub>(下标) <sup>(上标)

        7. <label>标簽

        8. <code>代碼塊

        特點：

        1.不獨占一行，同屬性(行内标簽)标簽會排在一起

        2.元素的寬度，高度，行高，頂部與底部的邊距不可以設定的(也就是說，即使你設定的寬高，不會起作用)

        3.内容撐開寬度

        三 内嵌塊标簽(inline-block)

        1. <img>圖檔标簽

        2. <input>文本輸入标簽

        特性

        1.不獨占一行

        2.元素寬度，高度，行高，頂部和底部的邊距可以設定的。