css 细线表格 css制作table细线表格常用属性

ttx9n · 发表于 2012-12-19 11:26:43

优化表格的过程中当然是却漂亮越好啊，所以css优化表格的属性就派上用场了，接下来介绍css优化细线表格注意的一些细节，需要的朋友可以了解下 Css制作table细线表格
1、介绍了一个不常用属性：border-collapse:collapse;
2、使用了一个属性缩写技巧：border:style color;border-width:上右下左;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>Css制作table细线表格</title> 
<style type="text/css" media="screen"> 
 
</style> 
</head> 
<body> 
<table> 
<thead> 
<tr><th>名称</th><th>网址</th><th>时间</th></tr> 
</thead> 
<tbody> 
<tr><td>百度</td><td>http://www.baidu.com</td><td>2007.01.11</td></tr> 
<tr><td>百度</td><td>http://www.baidu.com</td><td>2007.01.11</td></tr> 
<tr><td>百度</td><td>http://www.baidu.com</td><td>2007.01.11</td></tr> 
</tbody> 
<tfoot> 
<tr><td colspan="3">下一页</td></tr> 
</tfoot> 
</table> 
</body> 
</html>

提示：您可以先修改部分代码再运行

复制代码代码如下:
table {
border-collapse:collapse; /* 关键属性：合并表格内外边框(其实表格边框有2px，外面1px，里面还有1px哦) */
border:solid #999; /* 设置边框属性；样式(solid=实线)、颜色(#999=灰) */
border-width:1px 0 0 1px; /* 设置边框状粗细：上右下左 = 对应：1px 0 0 1px */
}

<thead> 表格头
<tbody> 表格正文
<tfoot> 表格？呵呵，我也不知道怎么说。明白就行了

复制代码代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Css制作table细线表格</title>
<style type="text/css" media="screen">

</style>
</head>
<body>
<table>
<caption>表格头</caption>
<thead>
<tr><th>名称</th><th>网址</th><th>时间</th></tr>
</thead>
<tbody>
<tfoot>
<tr><td colspan="3">下一页</td></tr>
</tfoot>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
<tr><th>百度</th><td>http://www.baidu.com</td><td>2007.01.11</td></tr>
</tbody>
</table>
</body>
</html>

lsc54 · 发表于 2022-9-20 16:44:19

啪啪啪生怕PSP怕

8ayoqrpj · 发表于 2022-12-4 03:52:10

哦哦哦ijhhsdj

0vwrdf6 · 发表于 2022-12-7 11:46:50

iiguuubhuiuihu

溪谷玉贤 · 发表于 2023-4-1 06:41:03

需要很久了终于找到了

.l4 · 发表于 2023-4-9 08:08:10

终于找到了，我擦

lba36h7g · 发表于 2023-9-8 17:35:07

抽根烟，下来看看再说

9jduu05 · 发表于 2023-10-22 18:25:50

数据库了多久撒快乐的健身卡啦

sykzus · 发表于 2024-5-12 04:44:51

有什么好的服务器

回复用户1 · 发表于 2024-5-17 19:40:35

我要金豆金豆金豆

账号		自动登录	找回密码
密码			立即注册

[CSS] css 细线表格 css制作table细线表格常用属性