CSS3?box-flex?屬性

實(shí)例

定義兩個(gè)靈活的p元素。如果父級(jí)box的總寬度為300px，＃P1將有一個(gè)100px的寬度，＃P2將有一個(gè)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 通過(guò)私有屬性 the -ms-flex 支持.

Firefox通過(guò)私有屬性 -moz-box-flex 支持.

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

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

---

屬性定義及使用說(shuō)明

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

提示:?隨著box收縮和增長(zhǎng)，元素是否靈活的收縮或增長(zhǎng)。每當(dāng)有額外的空間，在box里，元素靈活的擴(kuò)大來(lái)填補(bǔ)這一空間。

默認(rèn)值: 繼承: 版本: JavaScript 語(yǔ)法:

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

no

CSS3

object.style.boxFlex=2.0

---

語(yǔ)法

box-flex:?value;
值 描述

value	元素的靈活性。所有Flex都是相對(duì)的

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

總結(jié)

以上是生活随笔為你收集整理的CSS3 box-flex 属性的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。