想自学教程的朋友,就来教程巴巴。
教程巴巴
当前位置: 主页 > 图文 > 网页制作教程 >

十天学会DIV+CSS 第三天 二列和三列布局(4)

发布时间:2011-03-10 21:20 点击:
分享到:
【评论本教程】 【挑错本教程】
------分隔线----------------------------

也许预览出来的效果和我的不一样,别急,还有一项设置,默认body是有外边距的,所以这里还得设置body的外边距为0;点击css面板上的新建按钮,然后在新建面板中选择:标签(重定义标签外观),然后选择body,设置body的边界为0即可。

七、三列固定宽度

三列固定宽度可以在三列自适应基础上添加一个父div,并设置这个div的宽度即可,如下,添加一个id为content的父容器。

在源代码里选中这三个div,然后点击工具栏上的“插入div标签”按钮,这时弹出的窗口插入项会默认为:在选定的内容旁换行,输入id为content,然后给这个div定义个宽度

三列固定宽度出来了,要想实现三列固定宽度居中就更方便了,只需设置#content {margin:0 auto;}即可

八、IE6的3像素bug

3像素bug是IE6的一个著名的bug,当浮动元素与非浮动元素相邻时,这个3像素的Bug就会出现。看下面这个左列固定,右列液态的例子,css代码如下:

body { margin:0;}
#side { float: left; background:#99FF99; height: 300px; width: 120px;}