摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表格测试作业</title&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格测试作业</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
table {
border: 1px solid #ccc;
border-collapse: collapse;
width: 500px;
}
tr th {
border: 1px solid #ccc;
height: 50px;
}
tr td {
height: 50px;
border: 1px solid #ccc;
}
</style>
</head>
<body>
<table>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
<tr>
<td colspan="4">这是合并列1</td>
</tr>
<tr>
<td rowspan="2">这是合并行 1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</table>
</body>
</html>
批改老师:天蓬老师批改时间:2019-04-13 21:52:06
老师总结:有二点建议:
1. <style>中尽可能不要用*, 直接用标签名, 进行样式重置
2. <table>中推荐添加<tbody>, 否则有可能用js获取单元格数据时出错, 就算你不加, 浏览也会自己加, 不如你主动点