当前位置:首页 >> 

CSS使用ul进行网页的多列布局

来源: 不详 字体:[ ] 我要投稿

  

几天在用CSS写三列布局的时候突然想到的这样一个方法,这个想法自己都觉得有些疯狂,如果其中有什么不对的地方请各位不吝指教。

当需要写一个三列布局的时候,一般情况下我会选择使用如下的DIV布局方式:

使用这样的嵌套方式无疑可以使代码出错的概率减少很多,但同时这样的布局也略显复杂,对于后期的维护也略显不便。我们在布局导航时经常会使用到一个方法,那就是使用〈ul〉列表来进行布局,而导航可以形容为多列式的布局,既然如此,那么我们也就可以使用〈ul〉来进行页面的多列布局。

这是一个固定宽度的布局,也就是说流动性不强,流动性的布局目前还没有试验过,等有时间了再试验一下,下面贴上这个布局的代码:

使用UL进行多列布局

这是头部

  • 这是左边
    • 这是中间的上部
    • 这是中间的下部

  • 这是右边

这是底部

这段代码在IE7及FF3下都能正常显示,其他浏览器未做测试,如果你有更好的方法不妨提出来。

上一页:CSS盒模型制定宽度和高度的原理
下一 页:CSS网页设计非常有用的九个技巧
关于我们 - 网 站地图 - 友情连接 - 登陆投稿 - 版权声明 - 广告服务 - 联系我们 - 留言本
Copyright © 2008-2009 Www.999net.Com All Rights Reserved
E-mail:WebMaster@999net.com
Powered BY 中国站长网 - 草根站长资讯信息中心,打造中国最优秀站长网