首页 > 代码库 > html(2)有序，无序，定义列表，表格
html(2)有序，无序，定义列表，表格
1.无序列表
<ul>.............声明无序列表
<li></li>列表项
</ul>
例如：
<html>
<head>
<title>例如</title>
</head>
<body>
<ul>
<li>第一步：清洗面部</li>
<li>第二部：涂爽肤水</li>
<li>第三部：涂乳液</li>
<li>第四部：涂防晒</li>
</ul>
</body>
</html>
运行结果：
- 第一步：清洗面部
- 第二部：涂爽肤水
- 第三部：涂乳液
- 第四部：涂防晒
补充：type属性：circle(空心圆),square(实体方心)，默认情况下是实体方心
2.有序列表
<ol>.........声明有序列表
<li></li>列表项
</ol>
例如：
<html>
<head>
<title>例如</title>
</head>
<body>
<ol >
<li>先涂粉底再涂防晒</li>
<li>先涂防晒再涂粉底</li>
</ol>
</body>
</html>
运行结果：
- 先涂粉底再涂防晒
- 先涂防晒再涂粉底
补充：type属性：1,a,A
3.定义列表 -->表达对名词或概念的解释或者描述
<dl>......声明定义列表
<dt></dt>......列表项内容声明
<dd></dd>.....列表项内容
</dl>
例如：
<html>
<head>
<title>例如</title>
</head>
<body>
<dl>
<dt>cpb</dt>
<dd>日本高端护肤品品牌</dd>
<dt>雪花秀</dt>
<dd>韩国中高端护肤品品牌</dd>
</dl>
</body>
</html>
运行结果：
cpb
日本高端护肤品品牌
雪花秀
韩国中高端护肤品品牌
4.表格
<table>...表格标签...
<tr>...行标签...
<td></td>...单元格
</tr>
</table>
例如：
<html>
<head>
<title>生活用品</title>
</head>
<body>
<table border="2">
<tr>
<td>沐浴露</td>
<td>
<table border="2">
<tr>
<td>多芬</td>
<td>力士</td>
<td>强生</td>
</tr>
<tr>
<td>六神</td>
<td>舒肤佳</td>
<td>妮维雅</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>口红</td>
<td>
<table border="2">
<tr>
<td>纪梵希</td>
<td>MAC</td>
<td>香奈儿</td>
</tr>
<tr>
<td>雅思兰黛</td>
<td>圣罗兰</td>
<td>迪奥</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
运行结果
| 沐浴露 |
|
||||||
| 口红 |
|
table属性：align：left： 左对齐 center：居中对齐 right:右对齐 valign：top：顶端对齐 middle：居中对齐 bottom：低端对齐 baseline：基线对齐
callspacing：单元格与单元格之间的距离
cellpadding：单元格边界与单元格文字之间的距离
bgcolo：背景颜色
td属性：colspan：表示这一单元格占几格 rowspan：跨行
html(2)有序，无序，定义列表，表格