html5中文学习网

您的位置: 首页 > 视频教程 > CSS3视频教程 » 正文

三列宽度自适应结构中的的DIV写法_Div+Css教程

[ ] 已经帮助:人解决问题

 适用于左右栏是窄幅,中栏为主要内容显示,让其宽度自适应。U8QHTML5中文学习网 - HTML5先行者学习网

CSSU8QHTML5中文学习网 - HTML5先行者学习网

#main{U8QHTML5中文学习网 - HTML5先行者学习网
width:760px;U8QHTML5中文学习网 - HTML5先行者学习网
margin:0 auto;U8QHTML5中文学习网 - HTML5先行者学习网
}U8QHTML5中文学习网 - HTML5先行者学习网
.left{U8QHTML5中文学习网 - HTML5先行者学习网
width:100px;U8QHTML5中文学习网 - HTML5先行者学习网
float:left;U8QHTML5中文学习网 - HTML5先行者学习网
}U8QHTML5中文学习网 - HTML5先行者学习网
.right{U8QHTML5中文学习网 - HTML5先行者学习网
width:120px;U8QHTML5中文学习网 - HTML5先行者学习网
float:right;U8QHTML5中文学习网 - HTML5先行者学习网
}U8QHTML5中文学习网 - HTML5先行者学习网
.center{U8QHTML5中文学习网 - HTML5先行者学习网
margin:0 120px 0 100px;U8QHTML5中文学习网 - HTML5先行者学习网
width:auto;U8QHTML5中文学习网 - HTML5先行者学习网
}U8QHTML5中文学习网 - HTML5先行者学习网
.clear{clear: both;}U8QHTML5中文学习网 - HTML5先行者学习网

HTMLU8QHTML5中文学习网 - HTML5先行者学习网

<!--注意:center这个DIV的位置-->U8QHTML5中文学习网 - HTML5先行者学习网
<div id="main">U8QHTML5中文学习网 - HTML5先行者学习网
<div class="left"></div>U8QHTML5中文学习网 - HTML5先行者学习网
<div class="right"></div>U8QHTML5中文学习网 - HTML5先行者学习网
<div class="center"></div>U8QHTML5中文学习网 - HTML5先行者学习网
<div class="clear"></div>U8QHTML5中文学习网 - HTML5先行者学习网
</div>

(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助