CSS3中几个新增加的盒模型属性使用教程

2020-05-05 07:19:53易采站长站整理

 -moz-box-pack:end;   
 -webkit-box-pack:end;   
 -o-box-pack:end;   
 box-pack:end;   
}   
.wrap section{   
 width:100px;   
}   
.wrap .sectionOne{   
 background:orange;   
}   
.wrap .sectionTwo{   
 background:purple;   
}   
.wrap .sectionThree{   
 background:green;   
}  

start
在box-pack表示水平居左对齐,如下图所示
201631115555654.jpg (543×98)

end
在box-pack表示水平居右对齐,如下图所示
201631115611484.jpg (542×98)

center
在box-pack表示水平居中对齐,如下图所示
201631115630411.jpg (542×96)

justify
在box-pack表示水平等分父容器宽度(唯一遗憾的是,firefox与opera暂时不支持,只有safari、chrome支持)
201631115648907.jpg (540×97)