实例

最新推荐文章于 2024-09-14 12:37:34 发布

wangqazwsxedc

最新推荐文章于 2024-09-14 12:37:34 发布

阅读量320

点赞数

文章标签： html

本文链接：https://blog.csdn.net/wangqazwsxedc/article/details/104742487

版权

15.表格

<meta charset="UTF-8">

<title>Document</title>

<table border="2" width="400px" height="200px" align="center" bordercolor="red" bgcolor="#cccccc" background="../../image/bg.gif" cellspacing="0" cellpadding="0px" >

	<tr align="right" valign="top">

		<td>hello</td>

		<td>hello</td>

		<td>hello</td>

		<td>hello</td>

	</tr>

	<tr align="center" valign="middle" bgcolor="blue">

		<td>hello</td>

		<td bgcolor="yellow" valign="bottom">hello</td>

		<td>hello</td>

		<td>hello</td>

	</tr>

	<tr valign="bottom" background="../../image/qq.jpg">

		<td>hello</td>

		<td>hello</td>

		<td>hello</td>

		<td>hello</td>

	</tr>

</table>

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200308222906634.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdxYXp3c3hlZGM=,size_16,color_FFFFFF,t_70) 16.合并单元格

<meta charset="UTF-8">

<title>Document</title>

<!-- table>(tr>td{hello$}*4)*4 -->

<table border="1" width="500px" height="300px">

<tr>

	<td colspan="4" align="center">hello</td>

</tr>

	<tr>

		<td rowspan="3">hello1</td>

		<td>hello2</td>

		<td>hello3</td> 

		<td>hello4</td>

	</tr>

	<tr>

		<td>hello2</td>

		<td rowspan="2" colspan="2">hello3</td>

	</tr>

	<tr>

		<td>hello2</td>

	</tr>

</table>

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200308222929755.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdxYXp3c3hlZGM=,size_16,color_FFFFFF,t_70) 17.表格的高级标签 Document

<caption><h2>基本信息表</h2></caption>

<thead>

   <th>学号</th>

   <th>姓名</th>

   <th>年龄</th>

   <th>性别</th>

</thead>

<tbody bgcolor="cyan" align="left">

<tr>

   <td>1101</td>

   <td>王五</td>

   <td>19</td>

   <td>男</td>

</tr>

<tr>

   <td>1102</td>

   <td>李四</td>

   <td>19</td>

   <td>男</td>

</tr>

<tr>

    <td>1103</td>

    <td>张三</td>

    <td>20</td>

    <td>男</td>

</tr>

<tr>

    <td>1104</td>

    <td>马六</td>

    <td>20</td>

    <td>男</td>

</tr>

</tbody>

<tr>

   <td width="40%">总计人数</td>

   <td colspan="3">4</td>

</tr>

</table>

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200308222953208.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdxYXp3c3hlZGM=,size_16,color_FFFFFF,t_70)