css3 box sizing屬性值詳解

box-sizing屬性可以為三個值之一：content-box（default），border-box，padding-box。

content-box，border和padding不計算入width之內

padding-box，padding計算入width內

border-box，border和padding計算入width之內，其實就是怪異模式了~

ie8+瀏覽器支援content-box和border-box；

ff則支援全部三個值。

使用時：

-webkit-box-sizing: 100px; // for ios-safari, android

-moz-box-sizing:100px; //for ff

box-sizing:100px; //for other

栗子：

<

style 
type
="text/css"
>
.content-box
.padding-box
.border-box
style
>

關於css3 box sizing屬性

在css3中，box sizing提供了兩種選擇，乙個是content box，乙個是border box。content box的模式裡，元素設定的寬和高為內容寬高 而border box中，元素設定的寬高為整體元素呈現出來的寬高。使用第二種模式就省去了計算，能夠十分簡單地，不需計算內外邊距而設定...

技術 CSS3 box sizing 屬性

說到 ie 的 bug，乙個臭名昭著的例子是它對於 盒模型 的錯誤解釋 在 ie5.x 以及 quirks 模式的 ie6 7 中，將 border 與 padding 都包含在 width 之內。這為前端工程師的工作平添了不少麻煩，幾戶每個需要定義尺寸的 box 都要思量一下 是否觸發了 盒模型 ...

CSS3 box sizing 屬性的簡單認識

定義和用法 box sizing 屬性允許您以特定的方式定義匹配某個區域的特定元素。預設值 content box 繼承性 無 css版本 css3 語法 box sizing content box border box inherit 屬性值說明 content box 預設值 由css2.1規...