CSS 邊框不計算寬度是指,邊框線并不會影響元素的寬度和高度,舉個例子,當(dāng)你給一個元素設(shè)置了邊框,那么元素的實際寬度不會因為邊框的存在而改變,依然和沒有邊框時一樣。
這種特性在某些情況下非常有用,例如當(dāng)你想讓兩個元素之間有一定距離時,可以通過給其中一個元素設(shè)置邊框線來實現(xiàn),而不會影響兩個元素的布局。
下面是一個例子:
p { margin: 0; padding: 0; border: 2px solid black; }假設(shè)我們有一個段落,沒有設(shè)置邊框時它的寬度為 200px,高度為 100px。當(dāng)我們給它設(shè)置了 2px 的邊框時,它的寬度和高度依然是 200px 和 100px,只是外圍多出來了 2px 的邊框線而已。 此外,邊框不僅不會影響元素的寬度和高度,也不會影響元素的內(nèi)邊距和外邊距,因為這些屬性同樣不計算邊框的寬度。 綜上,我們可以通過 CSS 邊框不計算寬度這個特性,讓我們的布局更加靈活和方便。