HTML(2)
2020-01-24 本文已影响0人
山猪打不过家猪
表格
1.表格标签
<table>
<tr>
<td>姓名</td>
</tr>
</table>
2.表格属性
cellspacing单元格之间的距离；
cellpadding内容和边框的距离，一般为0
<table border =1 width = 500 height = 200 align="center" cellspacing = 0 cellpadding = 20>
<tr>
<td>姓名</td>
<td>年龄</td>
<td>性别</td>
</tr>
<tr>
<td>xiaowang</td>
<td>14</td>
<td>male</td>
</tr>
</table>
3.表头单元格标签
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
<tr>
<td>xiaowang</td>
<td>14</td>
<td>male</td>
</tr>
4.合并单元格
①先确定跨行rowspan还是跨列colspan
②根据先上后下，先左后右找到目标，写上合并规则
③删除多余单元格
image.png
<table border="1" cellpadding ="0" cellspacing = "0" width ="500" height = "249" align="center">
<caption><h4>个人简介</h4></caption>
<tr>
<th>排名</th>
<th>关键词</th>
<th>趋势</th>
<th >今日搜索</th>
<th>最近七日</th>
<th rowspan="2">照片粘贴处</th>
</tr>
<tr>
<td>1</td>
<td>鬼吹灯</td>
<td>↓</td>
<td>325</td>
<td>123</td>
</tr>
<tr>
<td>1</td>
<td>鬼吹灯</td>
<td>↓</td>
<td colspan="3">325</td>
</tr>
<tr>
<td>1</td>
<td>鬼吹灯</td>
<td>↓</td>
<td colspan="3">325</td>
</tr>
</table>
列表标签
列表常用来布局
1.无序列表
主要用于排版
<body>
<ul>
<li>apple</li>
<li>banana</li>
<li>melon</li>
</ul>
</body>
2.有序列表
主要用于制造表格
<ol>
<li>apple</li>
<li>banana</li>
<li>melon</li>
</ol>
</body>
3.自定义列表
一般出现在页面的最下面
image.png
<dl>
<dt>服务支持</dt>
<dd>售后政策</dd>
<dd>自助服务</dd>
<dd>相关下载</dd>
</dl>
<dl>
<dt>线下门店</dt>
<dd>小米之家</dd>
<dd>服务网点</dd>
<dd>授权体验店</dd>
</dl>
