用户登录  |  用户注册
首 页源码下载网络学院最新源码源码排行屏蔽广告
当前位置:新兴网络 > 网络学院 > 网页制作 > HTML

CSS + ul li实现表格效果

减小字体 增大字体 作者:佚名  来源:本站整理  发布时间:2010-08-25 10:49:12
HTML code运行代码复制代码编辑
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>表格</title>
<style>
#t {
width: 404px;
margin: 5px auto;
padding:0px;
border-top: #0066cc 1px solid;
border-left: #0066cc 1px solid;
display:table;
}
#t li {
float: left;
width: 100px;
height: 50px;
list-style-type: none;
border-right:#0066cc 1px solid;
border-bottom: #0066cc 1px solid;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>

<ul id="t">
<li style="width:403px;">表格</li>
<li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li>
</ul>

</body>
</html>

Tags:表格 table ul CSS

作者:佚名
  • 好的评价 如果您觉得此文章好,就请您
      100%(1)
  • 差的评价 如果您觉得此文章差,就请您
      0%(0)

网络学院评论评论内容只代表网友观点,与本站立场无关!

   评论摘要(共 0 条,得分 0 分,平均 0 分) 查看完整评论