====================非常重要=================
无序列表
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. Android开发 - 掌握ConstraintLayout(十一)复杂动画!如此简单!

    介绍 本系列我们已经介绍了ConstraintLayout的基本用法.学习到这里,相信你已经熟悉ConstraintLayout的基本使用了,如果你对它的用法还不了解,建议您先阅读我之前的文章. 使用 ...

  2. flask上下文(new)

    flask源码解析之上下文 引入 对于flask而言,其请求过程与django有着截然不同的流程.在django中是将请求一步步封装最终传入视图函数的参数中,但是在flask中,视图函数中并没有请求参 ...

  3. Javascript高级编程学习笔记(60)—— 事件(4)事件类型

    事件类型 Web浏览器中可能发生的事件有许多种类型 不同类型的事件都有着自己独特的信息 在“DOM3级事件”规范中,规定了以下几类事件: UI事件    当用户与页面元素交互时触发 焦点事件    当 ...

  4. laravel migrate时报错:Syntax error or access violation: 1071 Specified key was too long; max key length is 767 bytes

    今天在学习laravel的路由模型绑定时,在按照文档执行php artisan migrate时报错. In Connection.php line 664: SQLSTATE[42000]: Syn ...

  5. [Postman]代理(16)

    代理服务器充当内部网络和Internet之间的安全屏障,使Internet上的其他人无法访问内部网络上的信息. 什么是代理? 在基本网络中,客户端向服务器发出请求,服务器发回响应. 代理服务器是充当计 ...

  6. 学习关于display :flex 布局问题!

    很多人不明白这个display:flex是到底是什么东西,如何使用的  . 1.什么是display:flex呢? 答:flex是 flexible  box的缩写,意为弹性布局 :这个东西的引入,为 ...

  7. new 操作符 做了什么

    new 操作符 做了什么 new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例. 假设Test是一个构造函数,通常在创建对象的实例时,要使用new,eg:test = new ...

  8. 爬虫不过如此(python的Re 、Requests、BeautifulSoup 详细篇)

    网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动地抓取万维网信息的程序或者脚本. 爬虫的本质就是一段自动抓取互联网信息的程序,从网络获取 ...

  9. JAVA基础-输入输出流

    一,File类:文件的创建和删除 1.File(String pathname):pathname是指路径名称.用法 File file = new File("d:/1.txt " ...

  10. Vue 中是如何解析 template 字符串为 VNode 的?

    在接触 React 时候,我只了解到通过 babel 可以把 JSX 转成 VNode(通过调用 React.createElement 方法),但是对其具体是如何转换的却不了解. 很明显,回答失败. ...