您现在的位置是：网站首页> 编程资料编程资料
CSS教程:使用ul进行网页的多列布局_CSS布局实例_CSS_网页制作_
2021-09-10
1170人已围观
简介 几天在用CSS写三列布局的时候突然想到的这样一个方法，这个想法自己都觉得有些疯狂，如果其中有什么不对的地方请各位不吝指教。 当需要写一个三列布局的时候，一般情况下我会选择使用如下的DIV布局方式： 使用这样的嵌套方式无疑可以使代码出错的概率减少很多，但
几天在用CSS写三列布局的时候突然想到的这样一个方法，这个想法自己都觉得有些疯狂，如果其中有什么不对的地方请各位不吝指教。
当需要写一个三列布局的时候，一般情况下我会选择使用如下的DIV布局方式：
使用这样的嵌套方式无疑可以使代码出错的概率减少很多，但同时这样的布局也略显复杂，对于后期的维护也略显不便。我们在布局导航时经常会使用到一个方法，那就是使用
- 列表来进行布局，而导航可以形容为多列式的布局，既然如此，那么我们也就可以使用
- 这是左边
- 这是中间的上部
- 这是中间的下部
- 这是右边
- 来进行页面的多列布局。
这是一个固定宽度的布局，也就是说流动性不强，流动性的布局目前还没有试验过，等有时间了再试验一下，下面贴上这个布局的代码：
使用UL进行多列布局 这是头部
这段代码在IE7及FF3下都能正常显示，其他浏览器未做测试，如果你有更好的方法不妨提出来。
相关内容
- 网页超级链接该以什么方式打开?_CSS教程_CSS_网页制作_
- CSS盒模型制定网页的宽度和高度的原理_CSS教程_CSS_网页制作_
- CSS教程:闭合CSS浮动元素的几种方法_CSS教程_CSS_网页制作_
- 细说CSS3中的选择符_css3_CSS_网页制作_
- CSS:何制作一个向各个方向延展box?_CSS教程_CSS_网页制作_
- CSS教程:导致一些问题的overflow_CSS教程_CSS_网页制作_
- CSS教程：简单理解em_CSS教程_CSS_网页制作_
- CSS样式表教程:screen媒体类型的作用_CSS教程_CSS_网页制作_
- CSS:相同元素不同结构重复定义的问题_CSS教程_CSS_网页制作_
- 关于DIV CSS和XHTML CSS的理解_Div+CSS教程_CSS_网页制作_
