====================非常重要=================
无序列表
ul中有一个type属性四个属性值
type="disc" 实心圆点(默认)
type="square" 正方形
type="cicle" 空心圆
<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

有序列表
ol中有一个type属性,五个属性值
type="1"  数字1,2,3...(默认)
type="a"  小写字母a.b.c...
type="A"  大写字母A.B.C...
type="i"  小写罗马数字i,ii,iii...
type="I"  大写罗马数字I,II,III...

<ol>
    <li></li>
    <li></li>
    <li></li>
</ol>

定义列表

<dl>
    <dt>定义列表项</dt>
    <dd>列表项描述</dd>
    <dd>列表项描述</dd>
    <dt>定义列表项</dt>
    <dd>列表项描述</dd>
    <dd>列表项描述</dd>
    ...
</dl>
<dd></dd>用于描述<dt></dt>,<dt>和<dd>是同级标签。不能嵌套在对方里面。
<dl><dt><dd>三个必须组合使用。

开发经验:在实际开发中,ul和ol的编号去掉,使用图片代替。

dl dt dd 自定义列表后面的 dt  dd 两个标签是平级的,所以不能嵌套使用。

有图文显示的,那么基本都是使用自定义列表进行排版。

===========================================================

有序列表ol,无序列表ul,定义列表dl的更多相关文章

  1. 有序列表ol和定义列表dl,dt,dd

    有序列表是一种讲究排序列表结构,使用<ol>标签定义,其中包含多个<li>列表项目.一般网页设计中,列表结构可以互用有序或者无序类表标签.但是,在强调项目排序栏目中,选用有序列 ...

  2. bootstrap实现去点列表、内联列表、水平定义列表

    内联列表:通过添加类名“.list-inline”来实现内联列表,简单点说就是把垂直列表换成水平列表,而且去掉项目符号(编号),保持水平显示. 去点列表:通过给无序列表添加一个类名“.list-uns ...

  3. HTML 有序、无序和定义列表

    无序列表 <ul> <li>咖啡</li> <li>茶</li> <li>牛奶</li> </ul> 咖 ...

  4. HTML 列表 <ol><ul><li><dl><dt><dd>

    <ol>标签-有序列表 定义和用法: <ol>标签定义有序列表. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,ol 元素的 "compact&q ...

  5. 前端学习 -- Css -- 有序列表和无序列表

    列表就相当于去超市购物时的那个购物清单, 在HTML也可以创建列表,在网页中一共有三种列表: 1.无序列表 2.有序列表 3.定义列表 无序列表 - 使用ul标签来创建一个无序列表 - 使用li在ul ...

  6. 9月11日上午HTML有序列表、无序列表、网页的格式和布局

    样式表 六.列表方块 1.有序列表变无序列表 <ol> <li>张店</li> <li>桓台</li> <li>淄川</l ...

  7. 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

  8. 有序列表和无序列表、流、格式布局:position

    列表方块: 有序列表和无序列表 ol/ul 例如<ol: style:"list-style:""  "> 1.<ol: style:&quo ...

  9. html有序列表和无序列表

    css控制UL LI 的样式详解(推荐) CSS: 代码如下: #menu ul {list-style:none;margin:0px;} #menu ul li {float:left;} 代码如 ...

随机推荐

  1. 使用Nginx+Uwsgi部署Python Flask项目

    第一次用Flask做Web(也是第一次用Python做Web),在部署的时候遇到了不少问题,现在将过程就下来,供在这方面也有疑惑的人参考.(PS:使用Apache+mod_wsgi部署模式的可以参考另 ...

  2. Java开发微服务为什么一定要选spring cloud?

    来自:网易乐得技术团队,作者:董添 李秉谦 现如今微服务架构十分流行,而采用微服务构建系统也会带来更清晰的业务划分和可扩展性.同时,支持微服务的技术栈也是多种多样的,本系列文章主要介绍这些技术中的翘楚 ...

  3. IM系统的MQ消息中间件选型:Kafka还是RabbitMQ?

    1.前言 在IM这种讲究高并发.高消息吞吐的互联网场景下,MQ消息中间件是个很重要的基础设施,它在IM系统的服务端架构中担当消息中转.消息削峰.消息交换异步化等等角色,当然MQ消息中间件的作用远不止于 ...

  4. vue局部组件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. PHP调用百度天气接口API

    //百度天气接口API $location = "北京"; //地区 $ak = "5slgyqGDENN7Sy7pw29IUvrZ"; //秘钥,需要申请,百 ...

  6. 全栈开发工程师微信小程序-上(下)

    全栈开发工程师微信小程序-上(下) icon 图标 success, success_no_circle, info, warn, waiting, cancel, download, search, ...

  7. itext实现pdf自动定位合同签订

    需求 需要实现如下效果(最终效果) 思考 需求方的要求就是实现签订合同,实现方法不限,但过程中又提出需要在签章的过程中把签订日期的文字也打上去,这就有点坑了~ 一开始的想法是想办法定位需要签名的位置, ...

  8. 一文搞懂 Linux network namespace

    本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. 本文通过 IP ...

  9. Spring Data Redis 详解及实战一文搞定

    SDR - Spring Data Redis的简称. Spring Data Redis提供了从Spring应用程序轻松配置和访问Redis的功能.它提供了与商店互动的低级别和高级别抽象,使用户免受 ...

  10. Jade是变体的HTML

    在这段HTML代码中,div 包含了一个 a 元素与一段没有标记包围的文本.若要用Jade表述这段HTML,div 元素和 a 元素都可以用前面所述的方法实现,但剩下的那个没有标记包围的文本就不能用前 ...