小白教程
所有教程
关于
Search
108.162.216.106
108.162.216.106
参数设置
贡献
退出
操作
编辑
移动
保护
信息
历史
删除
查看“Css3 pr box lines”的源代码
本页内容
上一节:
Css3_pr_box_flex_group
下一节:
Css3_pr_box_ordinal_group
因为以下原因,您没有权限编辑本页:
您请求的操作仅限属于该用户组的用户执行:
用户
您可以查看和复制此页面的源代码。
{{DISPLAYTITLE:box-lines}}[[Category:css reference|117]] = CSS3 box-lines 属性 = 指定一个div box允许扩大到多行: <sample title="" desc="" lang="html" hererun="1"> div { display:box; box-orient:horizontal; box-lines:multiple; width:200px; } </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <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; /* W3C */ display:box; box-orient:horizontal; 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> </run> == 浏览器支持 == 目前所有主流浏览器都不支持box-lines属性。 == 属性定义及使用说明 == box-lines属性指定每当它运行在父级box的空间,列中是否会得到一个新的行。 '''提示:''' 默认情况下,横向盒里会在单一的行铺陈它的子元素,和一个纵向盒铺陈其在单个列中的子元素。 {| class="table table-striped table-hover" | 默认值: | single |- | 继承: | no |- | 版本: | CSS3 |- | JavaScript 语法: | object.style.boxLines="multiple" |} == 语法 == <pre> box-lines: single|multiple;</pre> {| class="table table-striped table-hover" ! 值 ! 说明 |- | single | 将被放置在单个行或列的所有子元素(元素不适合只会被认为是溢出) |- | multiple | box允许扩大到多行,以适应其所有子项 |}
返回至“
Css3 pr box lines
”。
上一节:
Css3_pr_box_flex_group
下一节:
Css3_pr_box_ordinal_group