行盒子的盒模型

2021-10-08 23:56:05 字數 593 閱讀 2821

常見的行盒: 包含具體內容的元素

span,strong,em ,i,img,video,audio

盒子沿著內容衍生

行盒不能設定寬高,行盒的寬高是根據內容的大小和多少決定的。調整行盒的大小應該使用字型的大小,行高,字型型別,間接調整。

內邊距(填充區)

水平方向有效,垂直方向只影響背景,不會佔據具體空間

邊框水平方向有效,垂直方向只影響背景,不會佔據具體空間

外邊距水平方向有效,垂直方向只影響背景,不會佔據具體空間

disply : inling-block 的盒子

不獨佔一行

盒模型中的所有尺寸都有效

在開發中經常用於分頁

空白摺疊經常發生在行盒內部或行盒之間

大部分元素,頁面上顯示的內容取決於元素的內容,此元素叫非可替換元素

少部分元素,在頁面上顯示的內容取決於元素的屬性,此元素叫可替換元素

可替換元素有 : img,video,audio

絕大部分的可替換元素都為行盒。可替換元素類似於行塊盒,所有的尺寸都有效

行盒的盒模型

盒子沿著內容延伸 行盒不能設定寬高 用字型大小 行高字型型別間接調整行盒的寬高 內邊框 填充區 水平方向有效,垂直方向不會實際佔據空間 邊框 水平方向有效,垂直方向不會實際佔據空間 外邊距 水平方向有效,垂直方向不會實際佔據空間 display inline block 的盒子 不獨佔一行 盒模型中...

行盒的盒模型

常見的行盒 包含具體內容的元素 span strong em i img video audio 盒子沿著內容延伸 行盒不能設定寬高 調整行盒的寬高,應該使用字型大小 行高 字型型別 間接調整。內邊距 填充區 水平方向有效,垂直方向不會實際佔據空間。邊框 水平方向有效,垂直方向不會實際佔據空間。外邊...

盒子模型 標準盒模型,怪異盒模型

當你的瀏覽器展現乙個元素時,這個元素會佔據一定的空間。這個空間由四部分組成。中間是元素呈現內容的區域。這個區域的外面是內邊距。再外面是邊框。最外面的是外邊距,外邊距將該元素與其它元素分開。內邊距,邊框和外邊距在元素的上 右 下 左都可以有不同的大小。所有這些大小值都可以為0。顏色 內邊距總是跟元素的...