1.如果是两列布局,就使用float :left; float:right; 来使其两列在一行上面
2.三列布局:
body{margin:0; padding:0}
.left{width:200px;height:500px;float:left;background:#ccc} .middle{height:500px;float:left;background:#999} .right{width:300px;height:500px;float:right; background:#ccc}
如上面设置成浮动的,却不能使其三列咋同一行
body{margin:0; padding:0}
//绝对定位,停靠在浏览器左侧
.left{
width:200px;
height:500px;
background:#ccc;
position:absolute;
left:0;
top:0;
}
// 设置左右的margin 值------------->顺序:上 右 下 左.middle{ height:500px; background:#999; margin:0 300px 0 200px
}
// 绝对定位,停靠在浏览器的右侧.right{ width:300px; height:500px; background:#ccc; position:absolute; right:0; top:0}
如果某文字超出某布局的范围,可以设置:word-break:break-all,就可以换行如果超出的想要不显示,可以设置overflow:hidden