塊狀元素和內聯元素的區別

內聯元素、塊狀元素、內聯塊的轉換：

• 內聯元素->塊狀元素：display:block;
• 塊狀元素->內聯元素：display:inline;
• 元素->內聯塊狀元素：display:inline-block;

塊狀元素（div、ul、ol、dl、li、p、h1~h6、table、form等）：

• 獨佔一行；
• 支持所有樣式；
• 不設置寬度時寬度爲父元素寬度；
• 換行符不解析。

內聯元素（span、a、strong、em、i、input、img等）：

• 可以在一行顯示；
• 不支持寬高，上下margin和padding等樣式會有問題；
• 寬度由內容撐開；
• 換行符會被解析（不同瀏覽器下寬度不一樣）。