版权声明:本文为博主原创文章,转载请注明出处。 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 | 规定应该从父元素继承轮廓宽度的设置。 |