【前端学习笔记day11】2.7. html列表标签+html列表 +有序列表+ 无序列表 +定义列表

2.7. html列表标签

html列表

有序列表

在网页上定义一个有编号的内容列表可以用<ol>、<li>配合使用来实现,代码如下:
<ol>
    <li>列表文字一</li>
    <li>列表文字二</li>
    <li>列表文字三</li>
</ol>

在网页上生成的列表,每条项目上会按1、2、3编号,有序列表在实际开发中较少使用。

无序列表

在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现,代码如下:
<ul>
    <li><a href="#">新闻标题一</a></li>
    <li><a href="#">新闻标题二</a></li>
    <li><a href="#">新闻标题三</a></li>
</ul>

在网页上生成的列表,每条项目上会有一个小图标,这个小图标在不同浏览器上显示效果不同,所以一般会用样式去掉默认的小图标,如果需要图标,可以用样式自定义图标,从而达到在不同浏览器上显示的效果相同,实际开发中一般用这种列表。

实际应用实例:

定义列表

定义列表通常用于术语的定义。

<dl> 标签表示列表的整体。 标签定义术语的题目。 <dd> 标签是术语的解释。一个 <dl> 中可以有多个题目和解释,代码如下: </dl> </dd> </dl>
<h3>前端三大块</h3>
<dl>
    <dt>html</dt>
    <dd>负责页面的结构</dd>

    <dt>css</dt>
    <dd>负责页面的表现</dd>

    <dt>javascript</dt>
    <dd>负责页面的行为</dd>

</dl>
全部评论

相关推荐

听说改名字就能收到offer哈:Radis写错了兄弟
点赞 评论 收藏
分享
寿命齿轮:实习就一段还拉了,项目一看就不是手搓,学历也拉了,技术栈看着倒是挺好,就是不知道面试表现能咋样。 不过现在才大三,争取搞两端大厂实习,或者一个纯个人项目+一段大厂,感觉秋招还是未来可期。
投递美团等公司10个岗位
点赞 评论 收藏
分享
评论
点赞
收藏
分享
牛客网
牛客企业服务