css居中布局
水平居中(宽度自适应)
1.inline-block+text-align
.child{
display:inline-block;/*变成行内块元素,让元素宽度自适应,不继承父元素宽度;*/
}
.parent{
text-align:center;
}
2.table+margin
.child{
display:table;/*变成table元素,可以让元素宽度自适应,不继承父元素宽度;*/
margin:0auto;
}
css多列布局
left
right
right
左边定宽,右边自适应
float+margin
.left{
width:100px;
float:left;
}
.right{
margin-left:120px;
}
float+overflow
/*和1方法表现的效果一样*/
.left{
width:100px;
float:left;
}
.right{
margin-left:20px;
overflow:hidden;
}
table
.parent{
display:table;
width:100%;
table-layout:fixed;
}
.left,.right{
display:table-cell;
}
.left{
width:100px;
padding-right:20px;
}
下一篇:web前端常见的加密算法有哪些