表格和表格属性

199 阅读1分钟
<!doctype html>
<html>
    <head>
        <title>
        </title>
    </head>
    <body>
        <caption>表格</caption><!--表格标题-->
        <table><!--定义表格-->
            <tr><!--行-->
                <td></td><!--单元格-->
            </tr>
        </table>
        <!--border:设置边框粗细(默认为0)
            bordercolor:边框颜色
            width:表格宽度
            height:表格高度
            bgcolor:背景色
            background:背景图片
            cellspacing:单元格间距(两个单元格之间的间距)
            cellpadding:单元格边距(内容与边框之间的间距)
            align:水平对齐方式-->
        <!--tr属性
            align:行内容水平对齐
            valign:行内容垂直对齐
            bgcolor:行背景颜色-->
        <!--td属性
            align:单元格水平对齐方式
            valign:单元格垂直对齐方式
            bgcolor:背景色
            gackground:背景图
            width:单元格宽度
            height:单元格高度
            colspan:单元格跨行
            rowspan:单元格跨列
            td的width和height有冲突优先显示较大值-->
            例子:三行两列表格,边框为1像素
        <table border="1">
            <tr>
                <td>1</td>
                <td>2</td>
            </tr>
            <tr>
                <td>3</td>
                <td>4</td>
            </tr>
            <tr>
                <td>5</td>
                <td>6</td>
            </tr>
        </table>
        <!--三行两列宽度800高度500边框为1单元格间距为0,第一列中的第一个和第二个单元格合并,第三行单元格合并-->
        <table align="center" width="800" height="500" border="1" cellspacing="0">
            <tr>
                <td rowspan="2">1</td>
                <td>1</td>
            </tr>
             <tr>
                <td>1</td>
            </tr>
             <tr>
                <td colsapn="2">1</td>
            </tr>
        </table>
        成绩单
        <table align="center" width="600" height="600" border="1px" cellspacing="0">
			<tr bgcolor="#8a8a8a">
				<th>学号</th><!--表头-->
				<th>姓名</th>
				<th>成绩</th>
			</tr>
			<tr>
				<td>001</td>
				<td>张三</td>
				<td>10</td>
			</tr>
			<tr bgcolor="#b9b9b9">
				<td>002</td>
				<td>李四</td>
				<td>20</td>
			</tr>
			<tr>
				<td>003</td>
				<td>王武</td>
				<td>30</td>
			</tr>
			<tr bgcolor="#ababab">
				<td>004</td>
				<td>赵刘</td>
				<td>40</td>
			</tr>
			<tr>
				<td colspan="3">判卷人:lyh</td>
			</tr>
		</table>
    </body>
</html>