表格内外边距行列合并


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
</head>
<body>
<!-- 
table
border  边框
width   宽度
height  高度
cellspacing   外边距   单元格与单元格之间的距离
cellpadding   内边距   单元格与内容之间的距离
bgcolor       背景颜色
background    背景图片


caption  表格标题

tr       表行  一行
align   水平对齐方式   left   center   right
valign  垂直对齐方式   top    middle   bottom



th       表头单元格  自带加粗和居中
td       普通单元格  
rowspan   行合并
colspan   列合并

作业:
用表格做一张简历


-->


<table border='1px' width='800px' height='800px' cellspacing='0px' cellpadding="0px" >
<col width='10%'><col width='5%'>
<!-- 表格标题 -->
<caption>课程表</caption>
<!-- 表头 -->
<tr>
<th colspan='2'></th>
<!-- <th></th> -->
<th>周一</th>
<th>周二</th>
<th>周三</th>
<th>周四</th>
<th>周五</th>
<th>周六</th>
<th>周末</th>
</tr>

<!-- 表格正文 -->
<tr align='center'>
<td rowspan='4' width='50px'>上午</td>
<td>1</td>
<td rowspan="2">美术</td>
<td rowspan="2">体育</td>
<td rowspan="2">自习</td>
<td rowspan="2">睡觉</td>
<td rowspan="2">电脑</td>
<td rowspan="2">游戏</td>
<td rowspan="2">睡觉</td>
</tr>
<tr align='center'>
<!-- <td>上午</td> -->
<td>2</td>
<!--    <td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td> -->
</tr>
<tr align='center'>
<!-- <td>上午</td> -->
<td>3</td>
<td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr align='center'>
<!-- <td>上午</td> -->
<td>4</td>
<td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr>
<td colspan='9' align='center'>午休</td>
</tr>
<tr>
<td>下午</td>
<td>5</td>
<td align='right' valign='top'>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr>
<td>下午</td>
<td>6</td>
<td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr>
<td>下午</td>
<td>7</td>
<td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr>
<td>下午</td>
<td>8</td>
<td>美术</td>
<td>体育</td>
<td>自习</td>
<td>睡觉</td>
<td>电脑</td>
<td>游戏</td>
<td>睡觉</td>
</tr>
<tr>
<td>回家玩去吧</td>
</tr>


</table>

</body>
</html>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容