HTMLtable布局

最新推荐文章于 2024-07-26 14:13:22 发布

Aries_Stark

最新推荐文章于 2024-07-26 14:13:22 发布

阅读量253

点赞数

分类专栏： HTML 文章标签： html

本文链接：https://blog.csdn.net/Aries_Stark/article/details/117373118

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文详细介绍了HTML表格的相关属性，如border、width、height、align、bgcolor等，以及元素的使用，包括thead、tbody、tfoot、th、tr和td。通过实例展示了如何进行表格的创建、行列合并以及嵌套。同时，讲解了rowspan和colspan属性在合并单元格中的应用。

摘要由CSDN通过智能技术生成

属性

border（边框默认为0） width height（单位 px %占容器） align （对齐 left center right） bgcolor（背景颜色） background（背景图片图片优先级高于颜色） cellpadding（边距） cellspacing（间距）

<table border="3" width="10%" height="10%" align="center" bgcolor="grey" cellpadding="30" cellspacing="20"></table>

无内容仅有属性

元素

thead（头部） tbody（主干） tfoot（尾部）th（thead中加粗）tr（行） td（列）
rowspan（在同一列上一二行合并） colspan（在同一行上一二列合并）

	<table border="3" align="center" bgcolor="grey" cellpadding="30" cellspacing="20">
    <thead>
    	<tr>
    		<th colspan="2">平方</th>
    	</tr>
    </thead>
    <tbody>
    	<tr>
    		<td>1</td>
    		<td>1</td>
    	</tr>
    	<tr>
    		<td>2</td>
    		<td>4</td>
    	</tr>
    </tbody>
    <tfoot>
    	<tr>
    		<td colspan="2">END</td>
    	</tr>
    </tfoot>
    </table>

在这里插入图片描述

table（表格嵌套）

	<table border="3" align="center" cellpadding="30" cellspacing="20">
    	<tr>
    		<th colspan="3">&nbsp;</th>
    	</tr>
    	<tr>
    		<td rowspan="2">&nbsp;</td>
    		<td>
    		    <table border="3" align="center" cellpadding="30" cellspacing="20">
    		        <tr>
    		            <td>&nbsp;</td>
    		            <td>&nbsp;</td>
    		        </tr>
    		    </table>
    		</td>
    		<td>&nbsp;</td>
    	</tr>
    	<tr>
    		<td>&nbsp;</td>
    		<td>&nbsp;</td>
    	</tr>
    </table>