您的位置：首页 > Web前端 > CSS

css3盒子布局-定义盒子布局的位置(box-ordinary-group)

2016-05-04 14:47 393 查看

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>css3定位布局-盒子布局的位置(box-ordinary-group)</title>

<style>

body{

margin:0;

padding:0;

text-align: center;

background-color: #d9bfe8;

}

.box{

margin:auto;

text-align:center;

width:988px;

display: box;

display: -moz-box;

display:-webkit-box;

-moz-orient: vertical;

-webkit-box-orient: vertical;

box-orient:vertical;

}

.box1{

-webkit-box-ordinal-group: 2;

-moz-box-ordinal-group: 2;

box-ordinary-group:2;

}

.box2{

-webkit-box-ordinal-group: 1;

-moz-box-ordinal-group: 1;

box-ordinary-group:1;

}

.box3{

-webkit-box-ordinal-group: 3;

-moz-box-ordinal-group: 3;

box-ordinary-group:3;

}

</style>

</head>

<body>

<h1>box-ordinary-group:integer,参数值是一个自然数,表示设置子元素的位置编号,如果没有指定值,默认为1,序号相同的按照加载的顺序进行排列</h1>

<div class="box">

<div class="box1">布局1</div>

<div class="box2">布局2</div>

<div class="box3">布局3</div>

</div>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航