上一期我们讲解了CSS的一列布局，今天我们来讲解一下CSS的多列布局。在开始讲解前，我要告诉那些想要了解网页设计的同学，在网页设计当中，一个网页的大部分都是可以使用软件的功能来完成的，但是软件毕竟是没有思维的，所以一般使用软件功能设计以后，还需要通过代码来调整一下细节。所以你要想成为一个优秀的设计师，那么你就要对代码多了解一些。

　接下来我们进入正题，首先我们来看看两列自适应宽度，如果进行的是软件功能操作的话，那么首先要插入两个div标签，在新建CSS的规则，调整两个标签的背景，方框的高、宽、浮动。在这里标签一为side，标签二位main，在这里side的方框数据为：高300、宽120，浮动左对齐。而main的数据为：高300、宽70%，在这里可以不用调试浮动了，但是左边界一定要调整，而调整的数值一定要以side的宽为标准，在这里就是120.调试完以后，浏览你会发现我们怎么调整浏览器的宽和高，显示的框架都会跟着变动，这类个技巧在网页中都会用到。

　接下来我们看看两列定宽居中，是如何实现的。先把main的高改为具体的数值为350，这样两个框架的数据都固定了，在源代码中选中这两个的代码插入div，填写id，也就是上期我们添加的div id="content"代码，在调整这个代码的规则，框架的高设置为两个标签的和，也就是470，在把边界的左右调整为自动，这样你在浏览器中看到你想要的效果了。

　在网页中，还有一些基础你是必须知道的，xhtml的块级元素(div)和内联元素(span)。块级元素就是一个方块，想段落一样，默认的占据一行出现。而内联元素，也叫内元素只能放在行内，就像一个单词，不会造成前后换行，起辅助作用。

　在这里我在介绍一下浮动，也就是float属性。在CSS中，每个元素都是可以符合偶那个的，而浮动元素会生成一个块级框，而不论它本身是何种元素；且要指明一个宽度，否则它会尽可能地窄；另外当可供浮动的空间小于浮动元素时，它会跑到下一行，直到拥有足够放下它的空间。