html中偶尔会使用到列表,记录一下。

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<style type="text/css">
.level_1{list-style-type:decimal;}
.level_2{list-style-type:upper-alpha;}
</style>
</head> <body>
<span>列表使用test:</span>
<ul class = "level_1">
<li>
亚洲
<ul class = "level_2">
<li>中国</li>
<li>日本</li>
</ul>
</li>
<li>
欧洲
<ul class = "level_2">
<li>德国</li>
<li>意大利</li>
</ul>
</li>
</ul>
</body>
</html>

1. 序号可以是数字、字母、罗马数字等,可以通过list-style-type 属性设置。

默认值: disc 点| circle圆圈 | square正方形 | decimal数字 | decimal-leading-zero 十进制数
| lower-roman 小写罗马文字| upper-roman 大写罗马文字| armenian亚美尼亚数字 | georgian乔治亚数字
| lower-alpha小写拉丁文 | upper-alpha大写拉丁文 | none无
| inherit继承
初始值: disc

2. 序号也可以显示图片,可以通过list-style-image 属性设置

 list-style-image:none/url("1.png")

Html 列表 li ul使用的更多相关文章

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

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

  2. 前端 HTML body标签相关内容 常用标签 列表标签 ul,ol,li

    列表标签 ul,ol,li ul.ol.li标签 都属于块级标签,独占一行 网站页面上一些列表相关的内容比如说物品列表.人名列表等等都可以使用列表标签来展示.通常后面跟<li>标签一起用, ...

  3. li ul 说明

    复制代码代码如下: <div id="menu">  <ul>  <li><a href="#">首页</ ...

  4. 关于css中列表(ul ol)存在默认间距的问题

    一.总结: 有时候我们要给列表(ul ol 本身就是属于块级元素)的上表框或下边框设置颜色,如下: 但是在给内联块级元素(inline-block)的上表框或下边框设置颜色的时候,就没有这么简单: 在 ...

  5. 无序列表li横向排列

    一.横向两列方式排列: 在网页中,很多地方都会用到无序列表横向排列的形式,通常的写法都是使得li的css样式设置为:float:left的形式即可,li会依次从最左边开始并列对齐, 例如: HTML中 ...

  6. CSS实现列表li边框重合问题

    CSS实现列表li边框重合问题 2017年04月13日 21:04:18 阅读数:5066 在我们写东西的时候经常要用到ul,但是也经常会出现li边框重合的问题,如下图:  可以看到每个格子的右边框和 ...

  7. ol,li,ul,dl,dt,dd

    块级元素div尽量少用,其实和table一样,嵌套越少越好,它也是会影响速度的! ol 有序列表. <ol> <li>……</li> <li>……< ...

  8. Html中列表标签<ul>的使用

    借助Html中的列标标签<ul>在某列文字前面添加标注 <html> <head> <title>文字上方添加标记说明</title> &l ...

  9. 横排列表(li)的左右对齐

    效果如下: HTML代码如下: <div class="overdiv"> <ul> <li>1</li> <li>2& ...

随机推荐

  1. C/C++的64为长整型数的表示

    在C/C++中,64为整型一直是一种没有确定规范的数据类型.现今主流的编译器中,对64为整型的支持也是标准不一,形态各异.一般来说,64位整型的定义方式有long long和__int64两种(VC还 ...

  2. DOM操作——JavaScript怎样添加、移除、移动、复制、创建和查找节点

    (1). 创建新节点 createDocumentFragment() // 创建一个DOM片段 createElement() // 创建一个具体的元素 createTextNode() // 创建 ...

  3. [Java]类的生命周期(上)类的加载和连接[转]

    本文来自:曹胜欢博客专栏.转载请注明出处:http://blog.csdn.net/csh624366188 类加载器,顾名思义,类加载器(class loader)用来加载 Java 类到 Java ...

  4. Codeforces Round #375 (Div. 2) B. Text Document Analysis 模拟

    B. Text Document Analysis 题目连接: http://codeforces.com/contest/723/problem/B Description Modern text ...

  5. FCKeditor如何升级CKEditor及使用方法

    之前编辑器用的是FCKeditor,因为项目原因需要升级为最新版本4.2.2,发现是已经更名为CKEditor. 百度了一下,据官方的解释,CK是对FCK的代码的完全重写. 项目环境是asp.net的 ...

  6. MikroTik RouterOS使用VirtualBox挂载物理硬盘作为虚拟机硬盘进行安装

    说明:这一切似乎在Windows下更好操作.虚拟机操作不是难点,难点在于虚拟磁盘的转换挂载 一.先挂载硬盘 # 创建虚拟镜像并映射到物理硬盘 cd "c:\Program Files\Ora ...

  7. HDU 4818 RP problem (高斯消元, 2013年长春区域赛F题)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4818 深深地补一个坑~~~ 现场赛坑在这题了,TAT.... 今天把代码改了下,过掉了,TAT 很明显 ...

  8. echarts 去掉网格线

    去掉 xAxis : [ splitLine:{ show:false }], yAxis : [ splitLine:{ show:false }]

  9. 《Linux设备驱动开发详解(第3版)》(即《Linux设备驱动开发详解:基于最新的Linux 4.0内核》)--宋宝华

    http://blog.csdn.net/21cnbao/article/details/45322629

  10. Java---16---多线程---死锁

    死锁: 概念: 所谓死锁: 是指两个或两个以上的进程在执行过程中,因争夺资源而造成的一种互相等待的现象,若无外力作用.它们都将无法推进下去.此时称系统处于死锁状态或系统产生了死锁,这些永远在互相等待的 ...