HTML列表与表格

border:控制边框

width:宽度

height:高度

table是表格 tr:行 td:列★

colspan:合并列★
rowspan:合并行★

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>列表/表格</title>
</head>

<body>
		<!--1.有序列表/想要不同的效果就用type=""-->
	 <ol>
		<li>夏侯惇</li>
		<li>夏侯渊</li>
		<li>夏侯恩</li>
		<li>曹孟德</li>
		<li>刘玄德</li>
		<li>张翼德</li>
	 </ol>
		<!--2.无序列表/想要不同的效果就用type=""-->
	 <ul>
	 	<li>赵子龙</li>
	 	<li>孙仲谋</li>
	 	<li>鲁子敬</li>
	 	<li>马孟起</li>
	 	<li>关云长</li>
	 	<li>周公瑾</li>
	 </ul>
		<!--3.定义列表/由定义条件和定义描述组成。-->
	<dl>
		<dt>语文</dt>
		<dd>这是一门写作文的学科</dd>
		<dt>数学</dt>
		<dd>这是一门写公式的学科</dd>
	</dl>
<hr>
		<!--表格标签-->
		<!--两行三列-->
		<!--border:控制边框 width:宽度 height:高度-->
		<!--table是表格 tr:行 td:列-->
		<!--在table表格中设置里宽高，里面的行和列不能超过table总体的宽高！！！-->
		<!--td标签属性
		    1.width="100":宽度
		    2.height="100":高度
		    colspan="2":合并列
		    rowspan="2":合并行
		-->
		<table border="1px" width="300px" height="100px">
			<tr height="50px">
				<td colspan="2">数学</td>
				<td>英语</td>
			</tr>
			<tr height="50px">
				<td colspan="3"></td>
			</tr>
		</table>
		<!--所谓两行，也是必须有列才能形成行列对称-->
		<table border="1px" width="100px" height="100px">
			<tr>
				<td rowspan="2"></td>
			</tr>
			<tr>
			</tr>
			<tr>
				<td></td>
			</tr>
		</table>
<hr>
<table border="1px" width="150px" height="150px">
		<tr height="50px">
			<td rowspan="2"></td>
			<td colspan="2" rowspan="2"></td>	
		</tr>
		<tr  height="50px">		
		</tr>
		<tr  height="50px">
			<td></td>
			<td colspan="2"></td>
		</tr>
	</table>
</body>
</html>

 

posted @ 2019-03-23 13:45  麻包缝裤衩  阅读(132)  评论(0)  编辑  收藏  举报