css实现左中右结构,css 渐变色 代码

css填充黑色，css如何制作幻灯，css语法规则总结，css管理员运行，css使div浮在上方，css表示id选择器，css 渐变色 代码

<div class="container">
<div class="box left"></div>
<div class="box middle"></div>
<div class="box right"></div>
</div>/* CSS代码 */<style>
.container {
width: 960px;
margin: 0 auto;
overflow: hidden;
}
.box {
height: 200px;
float: left;
}
.left {
width: 200px;
background: #ccc;
}
.middle {
width: 560px;
background: #eee;
}
.right {
width: 200px;
background: #ccc;
}
</style>

如上所示，大家先创建一个名为.container的div容器，并在其中分别创建三个名为.box的子元素，分别代表左、中、右三个部分。

在CSS中，大家对容器进行设定，使其具有960px的宽度，margin为0自动，overflow设为hidden，这样就可以防止内容超出容器部分被隐藏。对于.box元素，大家对其设定高度为200px，并设置为左浮动。

接下来，大家根据具体需求对左、中、右三个部分的宽度和背景色进行设置。左右两个容器的宽度为200px，中间容器的宽度为560px，并分别设置成灰色和浅灰色相间，让整个页面看起来更加舒适。这样，通过CSS的设置，大家就可以很轻松地实现一个完整的左中右结构的页面布局了。