ul: unordered lists 
ol: ordered lists 
li: Lists

ol 有序列表。

<ol>
<li>……</li>
<li>……</li>
<li>……</li>
</ol>
  表现为:

1……
2……
3……
  ul 无序列表,表现为li前面是大圆点而不是123

<ul>
<li>……</li>
<li>……</li>
</ul>
  很多人容易忽略 dl dt dd的用法

  

dl 内容块
  dt 内容块的标题
  dd 内容
  可以这么写:

<dl>
<dt>标题</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</dl>
  dt 和dd中可以再加入 ol ul li和p
  理解这些以后,在使用div布局的时候,会方便很多,w3c提供了很多元素辅助布局。

LI代码的格式化:

A).运用CSS格式化列表符:

以下是引用片段:
ul li{ 
list-style-type:none; 
}

B).如果你想将列表符换成图像,则:

以下是引用片段:
ul li{ 
list-style-type:none; 
list-style-image: url(/blog/images/icon.gif); 
}

C).为了左对齐,可以用如下代码:

以下是引用片段:
ul{ 
list-style-type:none; 
margin:0px; 
}

D).如果想给列表加背景色,可以用如下代码:

以下是引用片段:
ul{ 
list-style-type: none; 
margin:0px; 

ul li{ 
background:#CCC; 
}

E).如果想给列表加MOUSEOVER背景变色效果,可以用如下代码:

以下是引用片段:
ul{ list-style-type: none; margin:0px; } 
ul li a{ display:block; width: 100%; background:#ccc; } 
ul li a:hover{ background:#999; }说明:display:block;这一行必须要加的,这样才能块状显示!

F).LI中的元素水平排列,关键FLOAT:LEFT:

以下是引用片段:
ul{ 
list-style-type:none; 
width:100%; 

ul li{ 
width:80px; 
float:left; 
}

<ul><li>的区别

<LI> 的参数设定(常用):

例如: <li type="square" value="4">

type="square"

只适用于非顺序清单,设定符号款式,其值有三种,如下,内定为 type="disc":

以下是引用片段:
      符号 是当 type="disc" 时的列项符号。 
      符号 if" width=10 height=10 border=0> 是当 type="circle" 时的列项符号。 
      符号 是当 type="square" 时的列项符号。 
      value="4"

只适用于顺序清单,设定该一项的数目,其後各项将以此作为起始数目而递增,但前面各项则不受影响,其值只能是 1,2,3.. 等整数,没有内定值。

<UL>称为无序清单标记。

所谓无序清单就是在每一项前面加上 、、等符号,故又称符号清单。

<UL> 的参数设定(常用):

例如: <UL type="square">

type="square"

设定符号款式,其值有三种,如下,内定为 type="disc":

以下是引用片段:
      符号 是当 type="disc" 时的列项符号。 
      符号 是当 type="circle" 时的列项符号。 
      符号 是当 type="square" 时的列项符号。

<ul>是项目列表,<li>是列表项,项目列表就是用符号来列的,所以你列出来默认的就是黑点,还有一个是<ol>这个是编号列表,用数字来列的,也是用<li>做列表项

<li>是 list item 即列表项,但列表有很两种,所以外面得有 <ul> 或者 <ol> 用来区别无序列表(小点点)和有序列表(1,2,3...)

HTML中的ul, ol,li , dl,dt, dd标签的更多相关文章

  1. DIV+CSS中标签ul ol li dl dt dd用法

    ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...

  2. Div+css中ul ol li dl dt dd使用

    ol 有序列表.<ol><li>……</li><li>……</li><li>……</li></ol>表现 ...

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

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

  4. html中的dl,dt,dd标签

    html <dl> <dt> <dd>是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也 ...

  5. html dl dt dd标签元素语法结构与使用

    dl dt dd认识及dl dt dd使用方法 <dl> 标签用于定义列表类型标签. dl dt dd目录 dl dt dd介绍 结构语法 dl dt dd案例 dl dt dd总结 一. ...

  6. html dl dt dd标签元素语法结构与使用

    dl dt dd认识及dl dt dd使用方法 标签用于定义列表类型标签. dl dt dd目录 dl dt dd介绍 结构语法 dl dt dd案例 dl dt dd总结 一.dl dt dd认识 ...

  7. 前端学习笔记系列一:15vscode汉化、快速复制行、网页背景图有效设置、 dl~dt~dd标签使用

    ctrl+shift+p,调出configure display language,选择en或zh,若没有则选择安装使用其它语言,则直接呼出扩展程序搜索界面,选择,然后安装,重启即可. shift+a ...

  8. 关于H标签 DL DT DD标签的一个小故事

    看了一篇关于SEO论坛的论文,大概故事内容是:一个专业的销售公司,里面SEO  技术多多,可就是销售网站的SEO的情况极为恼火.这天,老板又招到了一个SEO,直接聘为SEO主管全权负责网站的SEO,并 ...

  9. html-2, a img ul li ol dl dt dd 标签与列表标签的简单使用

    <!-- a:  a{ /*清除a标签的下划线*/ text-decoration: none; }  (1)超链接 href 超链接的地址 target: _self 默认 在当前中打开链接地 ...

随机推荐

  1. UVA 818 Cutting Chains

    https://vjudge.net/problem/UVA-818 题意: 有n个圆环,其中有一些已经扣在了一起.现在需要打开尽量少的圆环,使得所有圆环可以组成一条链 n<=15 因为n< ...

  2. Codechef Observing the Tree

    Home » Practice(Hard) » Observing the Tree   https://www.codechef.com/problems/QUERY Observing the T ...

  3. KMP next表模板

    void makeNext(const char P[],int next[]) { int q,k;//q:模版字符串下标:k:最大前后缀长度 int m = strlen(P);//模版字符串长度 ...

  4. Fast File System

    不扯淡了,直接来写吧,一天一共要写三篇博客,还有两篇呢. 1. 这篇博客讲什么? Fast File System(FFS)快速文件系统,基本思想已经在在上一篇博客File System Implem ...

  5. 解决ajax chrome禁止本地浏览时加载本地其他文件的方法

    在chrome快捷键右键--属性 “ --allow-file-access-from-files ”,前面用空格隔开.然后应用--确定.

  6. Perl6 必应抓取(1):测试版代码

    一个相当丑漏的代码, 以后有时间再优化了. 默认所有查找都是15页, 如果结果没有15页这么多估计会有重复.速度还是很快的. sub MAIN() { my $fp = open 'bin_resul ...

  7. iTextSharp操作pdf之pdfCreater

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  8. [转载]FFmpeg完美入门[1] - FFmpeg介绍及安装

    1 FFmpeg简介 FFmpeg是一个开源免费跨平台的视频和音频流方案,属于自由软件,采用LGPL或GPL许可证(依据你选择的组件).它提供了录制.转换以及流化音视 频的完整解决方案.它包含了非常先 ...

  9. 在Linux上安装pycharm

    1.首先在官网下载pycharm并进行提取,将提取的文件夹放在/usr下面(或者任意位置) 2.然后vi /etc/hosts 编辑 将0.0.0.0 account.jetbrains.com添加到 ...

  10. 百度2017春招<度度熊回家问题>

    题目: 一个数轴上共有N个点,第一个点的坐标是度度熊现在位置,第N-1个点是度度熊的家.现在他需要依次的从0号坐标走到N-1号坐标.但是除了0号坐标和N-1号坐标,他可以在其余的N-2个坐标中选出一个 ...