首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

用UL兑现非Table四行三列布局

2012-10-29 
用UL实现非Table四行三列布局本页的CSS代码利用CSS将UL模仿出了表格的效果。htmlheadtitletest/titl

用UL实现非Table四行三列布局
本页的CSS代码利用CSS将UL模仿出了表格的效果。

<html><head><title>test</title><style type="text/css">ul{margin:0px;padding:0px;width:200px;}ul li{float:left;list-style-type:none;border-top:#000 solid 1px;border-left:#000 solid 1px;width:65px;}.border-r{border-right:#000 solid 1px;}.border-b{border-bottom:#000 solid 1px;}.border-l{border-right:#000 solid 1px;border-bottom:#000 solid 1px;}</style></head><body><ul><li>&nbsp;</li><li>&nbsp;</li><li class="border-r">&nbsp;</li></ul><ul><li>&nbsp;</li><li>&nbsp;</li><li class="border-r">&nbsp;</li></ul><ul><li>&nbsp;</li><li>&nbsp;</li><li class="border-r">&nbsp;</li></ul><ul><li class="border-b">&nbsp;</li><li class="border-b">&nbsp;</li><li class="border-l">&nbsp;</li></ul></body></html>

热点排行