列表:用来布局 表格:用来显示数据
分类:(1)无序列表(重点)
无序列表:<ul>
标签表示HTML页面中的无序列表,一般以项目符号呈现列表项,而列表项使用<li>
标签定义
基本结构及其代码如下:
<body>
<h4>我最喜欢吃的水果</h4>
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>草莓</li>
</ul>
</body>
运行截图如下:
注意:
无序列表没有级别之分,是并列的
<ul></ul>
中只能嵌套<li></li>
,嵌套其他标签是不被允许的
<li></li>
相当于一个容器,可以嵌套多个标签
(2)有序列表(了解)
有序列表:<ol>
标签表示HTML页面中的有序列表,列表排序以数字来显示,并且使用<li>
标签定义列表项
基本结构代码如下:
<body>
<h4>粉丝排行榜</h4>
<ol>
<li>谢娜 一亿</li>
<li>杨幂 九千万</li>
<li>baby 八千万</li>
</ol>
</body>
运行如下:
注意:
有序列表有级别之分
<ul></ul>
中只能嵌套<li></li>
,嵌套其他标签是不被允许的
<li></li>
相当于一个容器,可以嵌套多个标签
(3)自定义列表(重点)
自定义列表:<dl></dl>
标签用来定义描述列表,该标签会与<dt></dt>
(定义项目/名字) <dd></dd>
(描述每一个项目/名字)一起使用
基本结构:
<body>
<dl>
<dt>关注我们</dt>
<dd>新浪微博</dd>
<dd>微信公众号关注</dd>
<dd>电话联系</dd>
</dl>
</body>
运行如下