首页 > > 网页制作 > css >

8.html表格相关的标记9.html表格实战《简单的网…

2018-06-24 01:55:41来源：未知阅读 ()

<html>
<head>
<title>第八课标题表格</title>
<meta charset="utf-8">
</head>
<body>
	<table width="960" height="250" border="1" align="center" cellpadding="10" rules="all">
		<caption align="top"> 表格的标题</caption>
		<tr bgcolor="#ccc" align="center" valign="center">
			<th bgcolor="red" >班级</th>
			<th>姓名</th>
			<th>年龄</th>
			<th>成绩</th>
		</tr>
		<tr align="center" valign="center">
			<td>四年级一班</td>
			<td>张三</td>
			<td>16</td>
			<td>80</td>
		</tr>
		<tr  align="center" valign="center">
			<td>四年级一班</td>
			<td>李四</td>
			<td>14</td>
			<td bgcolor="#ccc"></td>
		</tr>
		<tr align="center" valign="center">
			<td>四年级一班</td>
			<td>王五</td>
			<td>18</td>
			<td>50</td>
		</tr>
		</table>
		<br/>
	<table width="960" height="250" border="1" align="center" cellpadding="10" rules="all">
		<tr bgcolor="#ccc" align="center" valign="center">
			<th bgcolor="red" >班级</th>
			<th>姓名</th>
			<th>年龄</th>
			<th>成绩</th>
		</tr>
		<tr align="center" valign="center">
			<td>四年级一班</td>
			<td>张三</td>
			<td>16</td>
			<td>80</td>
		</tr>
		<tr  align="center" valign="center">
			<td>四年级一班</td>
			<td>李四</td>
			<td>14</td>
			<td bgcolor="green">90</td>
		</tr>
		<tr align="center" valign="center">
			<td>四年级一班</td>
			<td>王五</td>
			<td>18</td>
			<td>50</td>
		</tr>		
	</table>
</body>
</html>

<html>
<head>
<title>第八课标题网页之战布局</title>
<meta charset="utf-8">
</head>
<body leftmargin="0" topmargin="0">
	<table border="0" width="960"  align="center" cellspacing="0" cellpadding="0">
		<tr height="90" bgcolor="red" align="center"><td><font size="6"><b>网页的头部</b></font></td></tr>
		<tr>
			<td>
				<table bgcolor="yellow" width="30%" height="500" align="left">
					<tr align="center"><td><font size="6"><b>网页的左部分</b></td></tr>
				</table>
				<table bgcolor="green" width="70%" height="500" align="left">
					<tr align="center"><td><font size="6"><b>网页的右部分</b></td></tr>
				</table>
			</td>
		</tr>
		<tr height="90" bgcolor="red" align="center"><td><font size="6"><b>网页的底部</b></font></td></tr>
	</table>
</body>
</html>

涉及的知识：
1、topmargin="0" 你设计的框架里网页上方的距离是多少0就是没有(英文翻译上边距)
2、leftmargin="0" 你设计的框架里网页左边的距离是多少0就是没有，如果居中显示就不需要左边了。(英文翻译左边距)
3、border="0"网页的边距
4、width="960"网页的宽度，也可以用百分比来计算
5、align="center"剧中显示
6、cellspacing="0" 单元格的间距
7、cellpadding="0" 单元格的边距
8、height="500"网页的高度，也可以用百分比来计算
9、<font size="6"> 可以设置字体的格式以及字体的大小
10、<b></b>字体加粗
11、<table><tr><td></td></tr></table> 表格，td是行，th是列。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有