box

英[b?ks] 美[bɑ:ks]

n.ボックス; 箱のような物體; ボックス; 哨兵室

vt. Put... into a box [box, box]

vt.& vi.Boxing

三人稱単數(shù): ボックス 複數(shù)形: ボックス 現(xiàn)在分詞: ボクシング 過去形: ボックス過去分詞: boxed

flex

英[fleks] 美[fl?ks]

v.曲げる(関節(jié)); 収縮する(筋肉); 強さを示す

n. Bend; [電気] 花線

三人稱単數(shù): flexes 現(xiàn)在分詞: flexing 過去形: flexed 過去分詞: flexed

css box-flex プロパティ 構文

関數(shù): ボックスの子要素のサイズを拡大または縮小できるかどうかを指定します。

構文: box-flex: value;

説明: value スケーラブルな要素の行。柔軟性は相対的なもので、たとえば、box-flex が 2 の子要素は、box-flex が 1 の子要素の 2 倍の柔軟性があります。

注: スケーラブルな要素は、ボックスの縮小または拡大に応じて省略または拡大できます。ボックス內に余分なスペースがある場合は常に、スケーラブル要素が拡張してそのスペースを埋めます。現(xiàn)在、box-flex 屬性をサポートしているブラウザはありません。 Firefox は、代替の -moz-box-flex プロパティをサポートしています。 Safari、Opera、および Chrome は、代替の -webkit-box-flex 屬性をサポートしています。

css box-flex プロパティ 例

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
display:-moz-box; /* Firefox */
display:-webkit-box; /* Safari and Chrome */
display:box;
width:300px;
border:1px solid black;
}

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

#p2
{
-moz-box-flex:2.0; /* Firefox */
-webkit-box-flex:2.0; /* Safari and Chrome */
box-flex:2.0;
border:1px solid blue;
}
</style>
</head>
<body>

<div>
<p id="p1">Hello</p>
<p id="p2">php中文網(wǎng)</p>
</div>

<p><b>注釋:</b>IE 不支持 box-flex 屬性。</p>

</body>
</html>

インスタンスの実行 ?

[インスタンスの実行] ボタンをクリックしてオンライン インスタンスを表示します