怎么用CSS设置html中的表格边框样式
3个回答
2017-06-09 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
表格的边框分为3个元素决定：table,th,td;
如果三种元素全部设置了border样式，那么会发现外层有2层border,里面的th与th，td与td,td与th之间的border也是有2层的，所以，在设置border之前最好先想好通过什么样的规则来展现boeder(因为方式很多，那么我们只能选择适合自己的-也就是用的习惯的)。另外，表格之间还有一个概念是表空间,可以通过给表格设置样式table{ border-collapse:collapse; border-spacing:0;}清除这些多余的空间，那么有了上面的准备工作之后，下面就开始border样式的设置--代码如下：
td,th{border-bottom: 1px solid #e3e3e3;//xia下边框border-right:1px solid #e3e3e3;//有边框}
如果三种元素全部设置了border样式，那么会发现外层有2层border,里面的th与th，td与td,td与th之间的border也是有2层的，所以，在设置border之前最好先想好通过什么样的规则来展现boeder(因为方式很多，那么我们只能选择适合自己的-也就是用的习惯的)。另外，表格之间还有一个概念是表空间,可以通过给表格设置样式table{ border-collapse:collapse; border-spacing:0;}清除这些多余的空间，那么有了上面的准备工作之后，下面就开始border样式的设置--代码如下：
td,th{border-bottom: 1px solid #e3e3e3;//xia下边框border-right:1px solid #e3e3e3;//有边框}
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
border:1px solid #000;
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
table{
border-collapse:collapse;
border: 1px solid black;
}
table th {
background-color: gold;;
height: 30px;
color: #fff;
}
table tr.tr1{
height: 150px;
border: 2px dashed pink;
}
table tr td.td1{
border: 2px solid green;
}
table td{
height: 30px;
border: 1px dotted red;
}
</style>
</head>
<body>
<table>
<thead>
<th width="30%">姓名</th>
<th width="70%">分数</th>
</thead>
<tr class="tr1"><td>小红</td><td>80</td></tr>
<tr><td class="td1">小明</td><td>90</td></tr>
<tr><td>小丽</td><td>88</td></tr>
<tr><td>小刘</td><td>85</td></tr>
<tr><td>小郑</td><td>89</td></tr>
</table>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
