Web前端 ---HTML语言表格(day002)

表格

网页中的表格也能由HTML语言来实现

表格的基本构成标签

table标签:表格标签

tr标签:表格中的行

th标签:表格的表头

td标签:表格单元格

用法:

		<!--表格从这里开始-->
		<table>
			<!-- 第一行从这里开始 -->
			<tr>
				<!-- 第一行第一列 -->
				<th>
					单元格所填内容
				</th>
				<!-- 第一行第二列 -->
				<th>
					单元格所填内容
				</th>
			<!-- 第一行从这里结束 -->
			</tr>
			<!-- 第二行从这里开始 -->
			<tr>
				<!-- 第二行第一列 -->
				<td>
					单元格所填内容
				</td>
				<!-- 第二行第二列 -->
				<td>
					单元格所填内容
				</td>
				<!-- 第二行从这里结束 -->
			</tr>
		<!-- 表格从这里结束 -->
		</table>

<th>为表头,通常是属性,自动居中。(一般仅用在第一行)可加入上一篇博客中介绍的部分标签,例如:<b><p>等等…格式为<th><b>内容<b></th>

<td>为单元格,可填一般的内容,不自动居中,但可加入上一篇博客中介绍的部分标签,例如:<b><p>等等…格式为<td><b>内容<b></td>

表格属性

1.border(边框属性):给你的表格加上边框。格式:<border="number">(number为边框厚度)

2.background(背景图案):给你的表格加上背景。格式:<background="图片位置">

3.bgcolor(背景颜色):给你的表格加上背景颜色。格式:<bgcolor="颜色(英文)">

4.cellpadding(内边距):调节你的单元格内容和边框的间距。格式:<cellpadding="number">

5.cellspacing(外边距,需结合border使用):用border创建的边框是两层,调节这两层边框的间距,若设置为0则边框变为实现。格式:<border=:"number" cellspacing="number">

6.align属性:包括:left,center,right.分别为居左中右。

7.valign属性:包括:top,middle,bottom.分别是居上中下。

注:表格较大时比较明显。

8.colspan属性(跨列合并单元格):用在需要合并的几列的首列,需将所占用行的相应列单元格删除。格式<colspan="number(需要合并的列数,包括本列在内)">

9.rowsoan属性(跨行合并单元格):用在需要合并的几行的首列,需将所占用列的相应行单元格删除。格式<rowspan="number(需要合并的行数,包括本行在内)">

作者联系方式:
qq945677662
vxa2482466921
如有错误,请帮忙指正,大家一起交流哈。

猜你喜欢

转载自blog.csdn.net/qq_23998145/article/details/109190646