有序列表：

在网页上定义一个有编号的内容列表可以用<ol>、<li>配合使用来实现，如：

<ol>

<li>列表文字一</li>

<li>列表文字二</li>

<li>列表文字三</li>

</ol>

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

写上面列表标签的快捷键：输入 ol>li*3 后，按Tab键 (其中的3可根据需要换成其他数字）

无序列表：

在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现，如：

<ul>

<li>列表文字一</li>

<li>列表文字二</li>

<li>列表文字三</li>

</ul>

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

定义列表：

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

<dl>标签表示列表的整体

<dt>标签定义术语的题目

<dd>标签是术语的解释

一个<dl>中可以有多个题目和解释

代码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>列表标签</title>

</head>

<body>

    <h1>有序列表</h1>

    <ol>

        <li>html</li>

        <li>css</li>

        <li>javascript</li>

    </ol>

    <!-- 快捷键：ol>li*4 按Tab键  效果如下：

    <ol>

        <li></li>

        <li></li>

        <li></li>

        <li></li>

    </ol>

    -->

    <h1>无序列表</h1>

    <ul>

        <li><a href="https://www.baidu.com">百度首页</a></li>

        <li><a href="https://www.sogou.com">搜狗首页</a></li>

        <li><a href="https://www.sohu.com">搜狐首页</a></li>

    </ul>

    <!-- 快捷键：ul>(li>a{首页})*3  按Tab键，效果如下：

    <ul>

        <li><a href="">首页</a></li>

        <li><a href="">首页</a></li>

        <li><a href="">首页</a></li>

    </ul>

    -->

    <h1>定义列表</h1>

    <h3>前端三大块</h3>

    <dl>

        <dt>html</dt>

        <dd>负责页面的结构</dd>

        <dt>css</dt>

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

        <dt>javascript</dt>

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

    </dl>

    <!-- 快捷键：dl>(dt+dd)*3 按Tab键  效果如下：

    <dl>

        <dt></dt>

        <dd></dd>

        <dt></dt>

        <dd></dd>

        <dt></dt>

        <dd></dd>

    </dl>

    -->

</body>

</html>

页面显示效果：

Html列表：的更多相关文章

  1. ASP.NET Aries 入门开发教程8：树型列表及自定义右键菜单

    前言: 前面几篇重点都在讲普通列表的相关操作. 本篇主要讲树型列表的操作. 框架在设计时,已经把树型列表和普通列表全面统一了操作,用法几乎是一致的. 下面介绍一些差距化的内容: 1:树型列表绑定: v ...

  2. ASP.NET Aries 入门开发教程6：列表数据表格的格式化处理及行内编辑

    前言: 为了赶进度,周末也写文了! 前几篇讲完查询框和工具栏,这节讲表格数据相关的操作. 先看一下列表: 接下来我们有很多事情可以做. 1:格式化 - 键值的翻译 对于“启用”列,已经配置了格式化 # ...

  3. ASP.NET Aries 入门开发教程3：开发一个列表页面及操控查询区

    前言: Aries框架毕竟是开发框架,所以重点还是要写代码的,这样开发人员才不会失业,哈. 步骤1:新建html 建一个Html,主要有三步: 1:引入Aries.Loader.js 2:弄一个tab ...

  4. ASP.NET Aries 入门开发教程2：配置出一个简单的列表页面

    前言: 朋友们都期待我稳定地工作,但创业公司若要躺下,也非意念可控. 若人生注定了风雨飘摇,那就雨中前行了. 最机开始看聊新的工作机会,欢迎推荐,创业公司也可! 同时,趁着自由时间,抓紧把这系列教程给 ...

  5. 散列表(hash table)——算法导论(13)

    1. 引言 许多应用都需要动态集合结构,它至少需要支持Insert,search和delete字典操作.散列表(hash table)是实现字典操作的一种有效的数据结构. 2. 直接寻址表 在介绍散列 ...

  6. Python列表去重

    标题有语病,其实是这样的: 假设有两个列表 : L1 = [1,2,3,4] ; L2 = [1,2,5,6] 然后去掉L1中包含的L2的元素 直接这样当然是不行的: def removeExists ...

  7. WPF 微信 MVVM 【续】修复部分用户无法获取列表

    看过我WPF 微信 MVVM这篇文章的朋友,应该知道我里面提到了我有一个小号是无法获取列表的,始终也没找到原因. 前两天经过GitHub上h4dex大神的指导,知道了原因,是因为微信在登录以后,web ...

  8. Emoji选项列表

    一.需要的前提文件 从网上下载Emoji的表情包,当然是png的图片,因为WPF不支持彩色的Emoji,所以,做列表的时候,需要用图片. 随着压缩包一起的还有一个Emoji.xml文件,文件的层级结构 ...

  9. UWP开发必备：常用数据列表控件汇总比较

    今天是想通过实例将UWP开发常用的数据列表做汇总比较,作为以后项目开发参考.UWP开发必备知识点总结请参照[UWP开发必备以及常用知识点总结]. 本次主要讨论以下控件: GridView:用于显示数据 ...

  10. 在DevExpress程序中使用GridView直接录入数据的时候，增加列表选择的功能

    在我上篇随笔<在DevExpress程序中使用Winform分页控件直接录入数据并保存>中介绍了在GridView以及在其封装的分页控件上做数据的直接录入的处理,介绍情况下数据的保存和校验 ...

随机推荐

  1. js调试console.log使用总结图解

    一 实例 打印字符串和对象: 可展开对象查看内部情况: 看一下console对象本身的定义情况: 输出对象情况: utag对象所在文件: 输出对象: 二 Console.log 总结 1   如果你j ...

  2. Redis托管Session

    一:redis托管session主要是为了不同域之间共享session.Asp.net提供了四种处理Session的方法 1.  InProc模式 这是ASP.NET默认的Session管理模式,在应 ...

  3. 修改Elasticsearch的settings

    解决:Limit of total fields [1000] in index [nginx-access-log] has been exceeded" 的问题 PUT http://1 ...

  4. mysql数据库授权

    mysql数据库授权所有人 grant all privileges on *.* to 'root'@'%' identified by 'password'; flush privileges; ...

  5. Python 枚举 enum

    Python 枚举 enum enum 标准模块在 3.4 版本才可以使用,3.3 以下版本需要独立安装:https://pypi.python.org/pypi/enum34#downloads,官 ...

  6. 进程用manager 和Queue 实现进程消费者生产者

    注意 : mgr = multiprocessing.Manager() 生成了一个守护进程,如果主进程完毕,mgr这个实例也没有了,所以在结尾加了mgr.join()才能运行 代码: import ...

  7. ♣eclipse护眼颜色和关键字颜色设置

    eclipse护眼颜色和字体大小设置   ♣eclipse护眼颜色和关键字颜色设置 ♣eclipse字体大小设置(包括jsp , .xml ,.java) 1.Eclipse字体大小调整: 窗口(Wi ...

  8. Qt Creator插件Todo

     转载:http://techieliang.com/2017/12/502/   文章目录 1. 插件启动 2. 插件效果 3. 插件配置 4. 使用 码代码的过程往往并不是一气呵成,有时候需要记录 ...

  9. 1402 后缀数组 （hash+二分）

    描述 后缀数组 (SA) 是一种重要的数据结构,通常使用倍增或者DC3算法实现,这超出了我们的讨论范围.在本题中,我们希望使用快排.Hash与二分实现一个简单的 O(n log^2⁡n ) 的后缀数组 ...

  10. Codeforces 1027D Mouse Hunt (强连通缩点 || DFS+并查集)

    <题目链接> 题目大意: 有n个房间,每个房间都会有一只老鼠.处于第i个房间的老鼠可以逃窜到第ai个房间中.现在要清理掉所有的老鼠,而在第i个房间中防止老鼠夹的花费是ci,问你消灭掉所有老 ...