html上左中右下布局,5种css实现左中右布局的方式

本文主要和大家介绍了css布局实现左中右布局的5种方式的相关资料,小编觉得挺不错的，现在分享给大家，也给大家做个参考，希望能帮助到大家。

效果如下：

左中右布局

content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

Document

html *{

margin: 0;

padding: 0;

}

article{

height: 100px;

}

section{

margin-top: 10px;

}

.left{

width: 300px;

height: 100px;

background-color: #823384;

text-align: center;

font-size: 20px;