小白教程
所有教程
关于
Search
172.69.59.206
172.69.59.206
参数设置
贡献
退出
操作
编辑
移动
保护
信息
历史
删除
查看“Css3 pr box ordinal group”的源代码
本页内容
上一节:
Css3_pr_box_lines
下一节:
Css3_pr_box_orient
因为以下原因,您没有权限编辑本页:
您请求的操作仅限属于该用户组的用户执行:
用户
您可以查看和复制此页面的源代码。
{{DISPLAYTITLE:box-ordinal-group}}[[Category:css reference|118]] = CSS3 box-ordinal-group 属性 = 指定的一个box的子元素的显示顺序: <sample title="" desc="" lang="html" hererun="1"> .box { display:-ms-flexbox; /* Internet Explorer 10 */ display:-moz-box; /* Firefox */ display:-webkit-box; /* Safari and Chrome */ display:box; border:1px solid black; } .ord1 { margin:5px; -ms-flex-order:1; /* Internet Explorer 10 */ -moz-box-ordinal-group:1; /* Firefox */ -webkit-box-ordinal-group:1; /* Safari and Chrome */ box-ordinal-group:1; } .ord2 { margin:5px; -ms-flex-order:2; /* Internet Explorer 10 */ -moz-box-ordinal-group:2; /* Firefox */ -webkit-box-ordinal-group:2; /* Safari and Chrome */ box-ordinal-group:2; } </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <style> .box { display:-ms-flexbox; /* Internet Explorer 10 */ display:-moz-box; /* Firefox */ display:-webkit-box; /* Safari and Chrome */ display:box; border:1px solid black; } .ord1 { margin:5px; -ms-flex-order:1; /* Internet Explorer 10 */ -moz-box-ordinal-group:1; /* Firefox */ -webkit-box-ordinal-group:1; /* Safari and Chrome */ box-ordinal-group:1; } .ord2 { margin:5px; -ms-flex-order:2; /* Internet Explorer 10 */ -moz-box-ordinal-group:2; /* Firefox */ -webkit-box-ordinal-group:2; /* Safari and Chrome */ box-ordinal-group:2; } </style> </head> <body> <div class="box"> <div class="ord2">First in source</div> <div class="ord1">Second in source</div> <div class="ord1">Third in source</div> </div> <p><b>注意:</b> Flexible boxes 不兼容于IE 9以及更早版本的浏览器</p> </body> </html> </run> == 浏览器支持 == 目前主流浏览器都不支持box-ordinal-group属性。 Internet Explorer 10 通过私有属性 ms-flex-order 支持. Firefox 通过私有属性 -moz-box-ordinal-group 支持. Safari和Chrome通过私有属性, -webkit-box-ordinal-group支持. '''注意:'''Internet Explorer 9及更早IE版本不支持弹性框. == 属性定义及使用说明 == box-ordinal-group 属性指定一个box的子元素的显示顺序。 具有较低值的元素显示在那些具有较高的值的元素之前。 '''注意:''' 同一组值的元素显示顺序取决于他们源顺序。 {| class="table table-striped table-hover" | 默认值: | 1 |- | 继承: | no |- | 版本: | CSS3 |- | JavaScript 语法: | object.style.boxOrdinalGroup=2 |} == 语法 == box-ordinal-group: integer; {| class="table table-striped table-hover" ! 值 ! 描述 |- | integer | 一个整数,指示子元素的显示顺序 |}
返回至“
Css3 pr box ordinal group
”。
上一节:
Css3_pr_box_lines
下一节:
Css3_pr_box_orient