box-sizing的允許值包括:
content-box(預設值),標準的盒子模型。border和padding不計算入width之內,物件的實際寬度element width=width+border+padding。
border-box(怪異模式)。border和padding計算入width之內。物件的實際寬度element width=width。
padding-box(一般不支援)。padding計算入width之內。物件的實際寬度element width=width+padding。
示例如下:
charset="utf-8">
type="text/css">
.content-box
.padding-box
.border-box
style>
head>
class="content-box">content-boxdiv>
class="padding-box">padding-boxdiv>
class="border-box">border-boxdiv>
body>
html>
瀏覽器顯示效果如下: CSS元素的width和水平margin的設定
如果沒有設定box sizing為其他值,元素預設的width是指其content box的寬度。只有width,height和margin可以設定為auto,padding和border必須設定為具體的值,或者預設值是0 1.在width,margin left和margin right這3個屬性...
轉 關於width與padding
首先談談 important問題的引起 盒模型問題 在css標準中,乙個盒模型包括4個區,分別是 內容 內邊距 padding 邊框 border 和外邊距 margin 而width寬度的計算,css有它的標準。但是實際上,不同的瀏覽器的表現卻不同。比如,firefox ff 是準確按照css標準...
css 父子盒子的width 問題
1.前言 平時在寫css的時候,並沒有刻意關注盒子的width屬性,有時候要加,有時候不加,有時候預設佔滿父盒子,有時候卻又沒有寬度。今來看看到底有哪些情況 2.介紹 dom結構 box son div div body css樣式 box son1.當沒有給子盒子設定寬度時 預設撐滿父盒子 效果如...