首页  新闻动态  文化知识  网络文摘  生活时尚  娱乐休闲  健康频道  外语学习  软件教学  程序设计  独山图片  书店网站 
  程序设计 > Html/Css > 正文
 

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

来源:独山在线 [2008-06-06]   浏览次数:4621
下面是源代码:

<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>
>>上篇:赋予表单INPUT元素特权
>>下篇:11种刷新按钮的方法
 
 
版权所有:独山在线 copyright ©2007-2024 www.dushan.net, All Rights Reserved.
   免责声明:本网转载或链接出于传递更多信息之目的,并不意味着赞同其观点或证实其内容的真实性。
   本站为公益性网站,旨在宣传独山,如有侵犯请和我们联系,经查实将及时删除! 工信部备案:黔ICP备07001263号-3