|
|||||||||||||||||
| 用UL实现非Table四行三列布局 |
|
|
先看看效果： 下面是源代码： <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> </li> <li> </li> <li class="border-r"> </li> </ul> <ul> <li> </li> <li> </li> <li class="border-r"> </li> </ul> <ul> <li> </li> <li> </li> <li class="border-r"> </li> </ul> <ul> <li class="border-b"> </li> <li class="border-b"> </li> <li class="border-l"> </li> </ul> </body> </html> 将上面的代码保存成html格式的网页文档就能看到效果了。 |
|
| 上一篇:DHTML的四个属性来动态操作页面元素的内容 下一篇:Html网页表格深层次使用技巧 |
| 大部分文章摘自网上，如有侵犯您的权益请与我们联系，我们会第一时间进行处理，谢谢! | [ 打印文章 ] [ 关闭窗口 ] |