表格 表格 表格 表格 表格 表格 表格 表格 我都做了注释了,你复制到记事本中,改下后缀名,打开看下效果!如果懂CSS的话一看就明白了
谁可以给我一个用CSS做好的表格代码啊?最好是两行四列的
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用CSS做表格</title>
<style type="text/css">
ul{padding:0;
width:324px; /*设置表格宽 */
height:42px;/*设置表格高*/
margin:30px;
border-top:red 1px solid;/*设置表格上边框*/
border-right:red 1px solid;/*设置表格右边框*/
}
li{ border-left:red 1px solid;/*设置表格左边框*/
border-bottom:red 1px solid;/*设置表格下边框*/
/*设置单元格边框*/
list-style:none;/*清除项目列表前的标记*/
float:left;/*设置单元格浮动,用于水平排列*/
display:block;/*设置单元格为块级元素于用语控制大小等*/
width:80px;/*设置单元格宽*/
height:20px;/*设置单元格高*/
text-align:center;/*设置单元格内文本对齐方式*/
}
/*原理就是利用项目列表的每个项目做出表格中的每个单元格,然后通过设置ul和li的边框达到设置表格的边框效果*/
</style>
</head>
<body>
<ul>
<li>表格</li>
<li>表格</li>
<li>表格</li>
<li>表格</li>
<li>表格</li>
<li>表格</li>
<li>表格</li>
<li>表格</li>
</ul>
</body>
</html>
我都做了注释了,你复制到记事本中,改下后缀名,打开看下效果!
如果懂CSS的话一看就明白了2013-11-10
不太明白你的意思.
CSS可以定义table 的样式等,但他不是制作table的.table也就是表格,他是html语言的一个标志
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th scope="col"> </th>
<th scope="col"> </th>
<th scope="col"> </th>
<th scope="col"> </th>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
这是一个2行四列的表格2013-11-10
表格的:cellspacing="0" cellpadding="0"
table{
margin:0px;
padding:0px;
}
table td{
margin:0px;
padding:0px;
}
至于边框,是table 上左,table td 是下右,就可以 了2013-11-10
自己研究研究一下
===========================
<!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=utf-8" />
<title>无标题文档</title>
<style>
body,ul,li{margin:0;padding:0;}
div{width:910px;border-top:1px solid black;border-left:1px solid black;background:#B1B1B1;}
div li{width:100px;float:left; list-style:none;height:20px;border-bottom:1px solid black;border-right:1px solid black;}
</style>
</head>
<body>
<div>
<ul>
<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>
</ul>
</div>
</body>
</html>2013-11-10