CSS3?box-flex?屬性

實例

定義兩個靈活的p元素。如果父級box的總寬度為300px，＃P1將有一個100px的寬度，＃P2將有一個200px的寬度：

#p1
{
-moz-box-flex:1.0; /* Firefox */
-webkit-box-flex:1.0; /* Safari and Chrome */
-ms-flex:1.0; /* Internet Explorer 10 */
box-flex:1.0;
border:1px solid red;
}

#p2
{
-moz-box-flex:2.0; /* Firefox */
-webkit-box-flex:2.0; /* Safari and Chrome */
-ms-flex:2.0; /* Internet Explorer 10 */
box-flex:2.0;
border:1px solid blue;
}
嘗試一下 ?

---

瀏覽器支持

目前主流瀏覽器不支持 box-flex 屬性。

Internet Explorer 10 通過私有屬性 the -ms-flex 支持.

Firefox通過私有屬性 -moz-box-flex 支持.

Safari和Chrome通過私有屬性 -webkit-box-flex 支持.

注意：?Internet Explorer 9及更早IE版本不支持彈性框.

---

屬性定義及使用說明

box-flex屬性指定box的子元素是否靈活或固定的大小。

提示:?隨著box收縮和增長，元素是否靈活的收縮或增長。每當有額外的空間，在box里，元素靈活的擴大來填補這一空間。

默認值: 繼承: 版本: JavaScript 語法:

0.0(表示該元素是不靈活的)

no

CSS3

object.style.boxFlex=2.0

---

語法

box-flex:?value;
值 描述

value	元素的靈活性。所有Flex都是相對的

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的CSS3 box-flex 属性的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。