版权声明:本文为博主原创文章,转载请注明出处。 https://blog.csdn.net/twilight_karl/article/details/54814015
css表格
| 属性 | 描述 |
|---|---|
| border-collapse | 是否把表格边框合并为单一边框 separate/collapse |
| border-spacing | 设置分隔单元格边框的距离 num |
| caption-side | 表格标题的位置 Top/bottom |
| empty-cells | 设置是否显示表格中的空单元格 hide/show |
| table-layout | 设置显示单元、行和列的算法 |
table-layout:
automatic: 列宽度由单元格内容设定。默认
fixed: 列宽由表格宽度和列宽度设定。
inherit: 规定应该从父元素继承 table-layout 属性的值。
一个简单的表格 
<html>
<head>
<style type="text/css">
table{
border-collapse:collapse;
border:solid 1px ;
width:50%;
}
table th{
background-color:skyblue;
color:white;
}
table th,td{
text-align:center;
border:solid 1px red ;
}
tr.em{
background-color:rgb(255,0,0);
}
</style>
</head>
<body>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr class="em">
<td>张三</td>
<td>男</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>20</td>
</tr>
<tr class="em">
<td>张三</td>
<td>男</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>20</td>
</tr>
</table>
</body>
</html>
outline 轮廓
outline-color 规定边框的颜色。
outline-style 规定边框的样式。
可能用到的样式
| 值 | 描述 |
|---|---|
| none | 定义无轮廓。默认 |
| dotted | 定义点状的轮廓。 |
| dashed | 定义虚线轮廓。 |
| solid | 定义实线轮廓。 |
| double | 定义双线轮廓。双线的宽度等同于 outline-width 的值。 |
| groove | 定义 3D 凹槽轮廓。此效果取决于 outline-color 值。 |
| ridge | 定义 3D 凸槽轮廓。此效果取决于 outline-color 值。 |
| inset | 定义 3D 凹边轮廓。此效果取决于 outline-color 值。 |
| outset | 定义 3D 凸边轮廓。此效果取决于 outline-color 值。 |
| inherit | 规定应该从父元素继承轮廓样式的设置。 |
outline-width 规定边框的宽度。
可能用到的值
| thin | 规定细轮廓。 |
|---|---|
| medium | 规定中等的轮廓.默认 |
| thick | 规定粗的轮廓。 |
| length | 允许您规定轮廓粗细的值。 |
| inherit | 规定应该从父元素继承轮廓宽度的设置。 |