CCS高階 div的寬度和高度是由什麼決定的?

2022-08-12 17:48:13 字數 874 閱讀 5231

我們先來看乙個例子。這個div的高度是多少呢?

當我們加上font-size:20px,div的高度變成了28px,why?

思考:是line-higth:normal影響的嗎?normal這個值是多少呢

不是。換個字型就不是了。預設是行高和字型設計有關係。

div的高度不確定。或者說div的高度等於line-height指定的高度。

文字垂直居中

讓乙個div高度是40px,不要寫死height,而是要用padding去撐出高度

div

複製**

文字垂直水平居中

再加上text-align:center;就可以實現文字垂直水平居中。

div

複製**

如何取消margin合併問題呢 ?

父元素加border屬性

父元素加padding屬性

父元素加overflow:hidden;(不推薦使用,會有bug)

什麼是文件流(normal flow):指的是元素排版布局過程中,內聯元素會預設自動從左往右,塊級元素從上往下的流式排列方式。並最終窗體自上而下分成一行行,並在每行中從左至右的順序排放元素。

脫離文件流(常見)

float:left;

position: absolute;

position:fixed;

**於:

關於div寬度和高度的100 設定的問題

設定div大小的有兩個屬性width和height,以前在學習div每次給div設定100 寬度或高度時都很迷惑,不明白這個100 的寬度 高度 到底有多寬有多高?這個100 是從 得到的從 繼承的?今天我們的話題就是有關div高度100 的問題!其實,要弄懂div寬度 width100 div高度...

關於Div的寬度與高度的100 設定

正像你所知道的那樣,設定div大小的有兩個屬性width和height,以前在學習div每次給div設定100 寬度或高度時都很迷惑,不明確這個100 的寬度 高度 到底有多寬有多高?這個100 是從 得到的從 繼承的?今天我們的話題就是有關div高度100 的問題!其實,要弄懂div寬度 widt...

關於Div的寬度與高度的100 設定

正像你所知道的那樣,設定div大小的有兩個屬性width和height,以前在學習div每次給div設定100 寬度或高度時都很迷惑,不明確這個100 的寬度 高度 到底有多寬有多高?這個100 是從 得到的從 繼承的?今天我們的話題就是有關div高度100 的問題!其實,要弄懂div寬度 widt...