单元格

表格标签

表格标签一般是展示数据的

<table>
    <tr>
         <th></th>
   		 <td></td>
    </tr>
</table>
<!--table是表格标签
tr是行
td是每一个单元格
th是表头，有加粗剧中的功能
他们之间是需要互相嵌套
tr必须嵌套在table
td和th必须签到到tr之中--> 

写法

<table>
			<tr>
				<th>姓名 </th>
				<th>性别 </th>
				<th>年龄 </th>
			</tr>
			<tr>
				<td>刘德华 </td>
				<td>男 </td>
				<td>56 </td>
			</tr>
			<tr>
				<td>张学友 </td>
				<td>男 </td>
				<td>56 </td>
			</tr>			
		</table>

表格标签的属性

表格标签的属性都要卸载table里面

属性名 属性值 描述

align left、center、right 对其位置

border 1或者"" 规定单元格是否有边框，默认为""表示没有边框

cellpadding 像素值 控制单元格边沿与内容之间的距离，默认是1像素

cellspacing 像素值 单元格和单元格之间的距离。默认是2，0是没有距离

width 像素值或百分比

练习

<table border="1" align="center" width="500" height="250" cellspacing="0">
    <thead>
			<tr>
				<th>排名</th>	
				<th>关键词</th>	
				<th>趋势</th>	
				<th>今日搜索</th>	
				<th>最近七日</th>	
				<th>相关链接</th>
			</tr>
    </thead>
	<tbody>
			<tr>
				<th>1</th>
				<th>鬼吹灯</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>345</th>
				<th>123</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
			<tr>
				<th>2</th>
				<th>盗墓笔记</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>124</th>
				<th>5214</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
			<tr>
				<th>3</th>
				<th>西游记</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>54</th>
				<th>965355</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
			<tr>
				<th>4</th>
				<th>水浒传</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>564</th>
				<th>85246</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
			<tr>
				<th>5</th>
				<th>三国演义</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>124346</th>
				<th>1213</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
			<tr>
				<th>6</th>
				<th>红楼梦</th>
				<th><img src="img/ikea.jpg" width="20" /></th>
				<th>76544</th>
				<th>2321</th>
				<th>
					<a href="https://www.baidu.com">贴吧</a>
					<a href="https://www.baidu.com">百科</a>
					<a href="https://www.baidu.com">图片</a>
				</th>
			</tr>
    </tbody>
</table>

表格的结果标签

<thead></thead>标签是头部区域的
<tbody></tbody>是表格的主题区域

使用这两个加入到表格里面，可以在代码书写时候折叠起来查看更清晰

单元格

原文：https://www.cnblogs.com/tallish/p/14897316.html