塊級元素和內聯元素的預設寬高

我們先明確一下文件流的概念：對於內聯元素，是從左到右排列的，

當寬度不夠時換行；對於塊級元素，是從上到下排列的，每乙個元素都另起一行。

一、內聯元素寬高的確定

寬度：不受width的限制，有文字內容決定的，padding 和 margin 可以改變寬度。

高度：不受height的限制，padding 和margin 也不能改變。可以通過line-height 和 font-size來改變。

二、塊級元素寬高的確定

寬度：1、可以自行設定width的值；

2、不設定寬度時的值為auto，預設寬度是父元素的寬度-自身的border-自身的margin。

3、需要注意的是如果寬度寫了100%，應該是元素內容的寬度（content）等於父元素的寬度，元素的寬度應該等於這個寬度加自身的border，會凸出來一部分。

高度：1、可以自行設定height的值；

2、預設值為0；

3、由元素內部的文件流中的元素的高度的總和決定的（裡面元素的height+padding+margin有合併的可能），當元素脫離文件流時，不能用於父元素高度的計算；

4、當塊級元素裡面是文字時，文字只有一行，高度由line-height決定，文字有多行，會自動換行，但是碰到長度很長的單詞時需要手動新增連字元（-）換行，有乙個屬性與之相關，word-breaking: break all; 超出寬度，不管單詞是否結束都換行。

三、inline-block元素寬高的確定

寬度：1、設定width的值，超出寬度部分的處理方式和div一樣，多個inline-block元素處於一行中時和inline元素的效果一樣，可以用white-space控制是否換行；

2、內容決定寬度。

塊級元素和內聯元素的預設寬高

我們先明確一下文件流的概念 對於內聯元素，是從左到右排列的，當寬度不夠時換行 對於塊級元素，是從上到下排列的，每乙個元素都另起一行。寬度 不受width的限制，有文字內容決定的，padding 和 margin 可以改變寬度。高度 不受height的限制，padding 和margin 也不能改變。...

塊級元素和內聯元素的寬高是如何確定的

原文 在剛接觸css的時候，每次給元素新增樣式，都習慣性的寫上寬是多少，高是多少，為自己挖坑無數，還暗自抱怨說css好煩，不過它真的是好煩，脾氣很怪。好，言歸正傳。在討論元素的寬高是如何確定的之前，我們先明確一下文件流的概念 對於內聯元素，是從左到右排列的，當寬度不夠時換行 對於塊級元素，是從上到下...

塊級元素和內聯元素

我們首先要了解，所有的html元素，都要麼是block 塊元素 要麼是inline 內聯元素 下面了解一下block inline各自的特點 block元素的特點 example source code www.52css.com 總是在新行上開始 高度，行高以及頂和底邊距都可控制 寬度預設是它的容...