css box-lines屬性
翻譯結果:
box
英[bɒks] 美[bɑ:ks]
n.盒;箱狀物;包廂;哨房
vt.把…裝入盒子[箱,盒子]中
vt.& vi. 拳擊
第三人稱單數:boxes 複數: boxes 現在分詞: boxing 過去式:boxed 過去分詞: boxed
lines
英[laɪnz] 美[laɪnz]
n.線路;線;(演員的)台詞;排(line的名詞複數);方法
v.排隊( line的第三人稱單數);用線標出;[棒球](擊球手)擊出(平直球);給…安襯裡
css box-lines屬性語法
作用:規定如果列超出了父框中的空間,是否要換行顯示。
語法:box-lines: single|multiple;
說明:single所有子元素會被放置在單獨的行或列中。 (無法匹配的元素會被視為溢出)。 multiple允許框擴展為多行,以容納其所有子元素。
註解:預設地,水平框會在單獨的行中排列其子元素,而垂直框會在單獨的列中排列其子元素。
css box-lines屬性範例
<!DOCTYPE html> <html> <head> <style> .container { width:300px; border:1px dotted black; /* Firefox */ display:-moz-box; -moz-box-orient:horizontal; -moz-box-lines:multiple; /* Safari and Chrome */ display:-webkit-box; -webkit-box-orient:horizontal; -webkit-box-lines:multiple; .box { width:100px; /* Firefox */ -moz-box-flex: 1.0; /* Safari and Chrome */ -webkit-box-flex: 1.0; /* W3C */ box-flex: 1.0; } </style> </head> <body> <div class="container"> <div class="box">11111111111</div> <div class="box">22222222222</div> <div class="box">33333333333</div> <div class="box">44444444444</div> </div> <p><b>注释:</b>目前没有浏览器支持 box-lines 属性。</p> </body> </html>
執行實例 »
點擊 "執行實例" 按鈕查看線上實例