HTML5 （四） 假链接和列表

假链接：

什么时假链接？假链接就是点击之后不会进行跳转的链接称之为链接，在开发中，常常先使用假链接代替链接。

假链接的俩种格式：

#

javascript

俩者的区别：使用#，倘若当前页面不在顶部，点击这个假链接会直接跳转到顶部；而使用javascript则不会。

列表标签：

什么是列表标签？给一堆数据添加语义，告诉搜索引擎一堆数据是一个整体。

HTML列表中的分类：

列表分类	使用频率	英文
无序列表	最多	unordered list
有序列表	最少	ordered list
定义列表	其次	definition list

 

无序列表：

什么是无序列表？给一堆数据添加列表语义，并且一堆数据中所有数据都没有先后之分。

这里说一下什么是先后之分。

• 有先后之分：例如排行榜，排位前后是关系的。
• 无先后之分：例如中国有哪些城市，先后顺序无关紧要。

无序列表格式:

<ul>
    <li>需要显示的条目</li>
</ul>
li其实是英文list item的缩写。list是列表 item是条目（结合起来是列表条目）

无序列表的注意点：

1. 一定要记住ul标签用来给一堆数据添加列表语义的，而不是用它来给他们添加小圆点。
2. ul标签和li标签是一个整体组合，所以一般情况下这俩个标签是同时出现的。
3. 因为ul标签和li标签是一个组合，所以在ul标签中不推荐使用其他标签，也就是说一般情况下不会再ul标签中使用其他标签，但是li标签中我们仍然可以添加其他标签。

无序列表场景：

• 新闻列表。
• 导航条。
• 商品列表。

无序列表代码参考：

<h2>中国的城市有哪些</h2>
<ul>
    <li>北京</li>
    <li>广州</li>
    <li>上海</li>
    <li>深圳</li>
</ul>

有序列表：

什么是列表？给一堆数据添加有序列表语义，使一堆数据在列表中排序，并且有先后之分。

格式：

<ol>
    <li></li>
</ol>
其他用法都和差不多。

有序列表代码展示：

<ol type="I">
    <li>星月</li>
    <li>演员</li>
    <li>其实我知道你都知道</li>
    <li>其实</li>
    <li>哦</li>
</ol>
type属性可以确定用哪种符号进行排序。

定义列表：

什么是定义列表？给一堆列表添加定义列表语义，先通过dt标签定义li列表中的所有标签，然后再通过dd标签给每个标题添加描述。

格式：

<dl>
    <dt></dt>
    <dd></dd>
    <dt></dt>
    <dd></dd>
</dl>
其实dt和dd都是英文的缩写。
dt使英文definition title的缩写，所以dt的含义就是用来定义列表。
dd是英文definition description的缩写，所以dd的含义就是用来定义标题对应的描述。

定义列表的注意点：

1. 和ul/ol一样，dl和dt/dd是一个整体，所以他们一般情况下不会单独出现，都是一起出现。
2. 和ol/ul一样，由于dl和dt/dd是一个组合标签。
3. 所以dl中建议只放dt和dd标签。
4. 一个dt可以没有对应的dd，也可以有多个对应的但是不推荐，一般一个dt只配一个dd。

定义列表代码展示：

<dl>
    <dt>北京</dt>
    <dd>中国的首都</dd>
    <dt>广州</dt>
    <dd>我所在的城市</dd>
</dl>