html表格基础
表格主要用于显示数据，而不是页面布局。
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
表格的html属性：
width：宽
height：高
cellspacing：相邻单元格边框间距
cellpadding：内容距离边框的间距
border：边框
bordercolor：边框颜色
align：水平对齐方式（left center right）加在table，tr，td上效果不同。
合并单元格：
rowspan：合并列
colspan：合并行
无论合并行、还是合并列，操作的都是td！！！
案例：
html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
table tr td{
border-top: 1px;
border-left: none;
border-right: none;
}
table tr:first-child{
background-color: blue;
}
table tr:nth-child(2){
background-color: cornflowerblue;
}
table tr:nth-child(7){
background-color: cornflowerblue;
}
.pink{
background-color: pink;
}
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" width="800" height="300" border="1">
<tr align="center">
<td>代号</td>
<td>刊名</td>
<td>刊期</td>
<td>出版地</td>
<td>年定价</td>
<td>CN号</td>
</tr>
<tr>
<td colspan="6">A马克思主义毛思想</td>
</tr>
<tr align="center">
<td>001</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center" class="pink">
<td>002</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center">
<td>003</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center" class="pink">
<td>004</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr>
<td colspan="6">B哲学.美学.心理学.宗教</td>
</tr>
<tr align="center">
<td>004</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center" class="pink">
<td>004</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center">
<td>004</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
<tr align="center" class="pink">
<td>004</td>
<td>马克思主义研究</td>
<td>月刊</td>
<td>北京</td>
<td>144.0</td>
<td>11-3911</td>
</tr>
</table>
</body>
</html>
浙公网安备 33010602011771号