admin管理员组

文章数量:1533054

2024年5月12日发(作者：)

二列和三列布局

web标准(div+css)》的二列和三列布局，将涉及到以下内容和知识点

▪ 二列自适应宽度

▪ 二列固定宽度

▪ 二列固定宽度居中

▪ xhtml的块级元素(div)和内联元素(span)

▪ float属性

▪ 三列自适应宽度

▪ 三列固定宽度

▪ 三列固定宽度居中

▪ IE6的3像素bug

一、两列自适应宽度

下面以常见的左列固定右列自适应为例，因为div为块状元素，默认情况下占据一行

的空间，要想让下面的div跑到右侧，就需要做助css的浮动来实现。首先创建html代码

如下：

此处显示 id "side" 的内容

此处显示 id "main" 的内容

按照如图所示的创建方法，把两个div都创建出来，或手工写出代码。div创建完成后，

开始创建css样式表，代码如下：

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

#main { background: #99FFFF; height: 300px; width: 70%; margin-left: 120

px; }

本文标签： 创建元素代码宽度表格

版权声明：本文标题：Dreamweaver8系列DIV+CSS教程表格二列和三列布局 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/dianzi/1715481155a454375.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。