左右布局
块级元素的文档流是从上往下的，一个元素会直接占据一行。
我们一般会使用float属性来实现左右布局。
左中右布局
使用position属性，代码如下，对子元素使用绝对定位，父元素相对定位，来达到我们的目的。
<body>
<div class="big">
<div class="small"></div>
<div class="small" style="left: 150px;"></div>
<div class="small" style="left: 300px;"></div>
</div>
</body>
<style>
.big{
position: relative;
}
.small{
height: 100px;
width: 100px;
border: 1px solid red;
position: absolute;
}
</style>
效果图
水平居中
1、块级元素在页面中水平居中一般使用margin属性，左右外边距设置为auto;
2、或者也可以使用text-align: center;属性
3、内联元素水平居中可以帮其父元素设置相同的左右内边距；
垂直居中
常用的话还是帮父元素设置相同的上下内边距，或者使用vertical-align: center;属性。
先写到这
网友评论