Html 列表 li ul使用
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使用的更多相关文章
- HTML 列表 <ol><ul><li><dl><dt><dd>
<ol>标签-有序列表 定义和用法: <ol>标签定义有序列表. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,ol 元素的 "compact&q ...
- 前端 HTML body标签相关内容 常用标签 列表标签 ul,ol,li
列表标签 ul,ol,li ul.ol.li标签 都属于块级标签,独占一行 网站页面上一些列表相关的内容比如说物品列表.人名列表等等都可以使用列表标签来展示.通常后面跟<li>标签一起用, ...
- li ul 说明
复制代码代码如下: <div id="menu"> <ul> <li><a href="#">首页</ ...
- 关于css中列表(ul ol)存在默认间距的问题
一.总结: 有时候我们要给列表(ul ol 本身就是属于块级元素)的上表框或下边框设置颜色,如下: 但是在给内联块级元素(inline-block)的上表框或下边框设置颜色的时候,就没有这么简单: 在 ...
- 无序列表li横向排列
一.横向两列方式排列: 在网页中,很多地方都会用到无序列表横向排列的形式,通常的写法都是使得li的css样式设置为:float:left的形式即可,li会依次从最左边开始并列对齐, 例如: HTML中 ...
- CSS实现列表li边框重合问题
CSS实现列表li边框重合问题 2017年04月13日 21:04:18 阅读数:5066 在我们写东西的时候经常要用到ul,但是也经常会出现li边框重合的问题,如下图: 可以看到每个格子的右边框和 ...
- ol,li,ul,dl,dt,dd
块级元素div尽量少用,其实和table一样,嵌套越少越好,它也是会影响速度的! ol 有序列表. <ol> <li>……</li> <li>……< ...
- Html中列表标签<ul>的使用
借助Html中的列标标签<ul>在某列文字前面添加标注 <html> <head> <title>文字上方添加标记说明</title> &l ...
- 横排列表(li)的左右对齐
效果如下: HTML代码如下: <div class="overdiv"> <ul> <li>1</li> <li>2& ...
随机推荐
- C/C++的64为长整型数的表示
在C/C++中,64为整型一直是一种没有确定规范的数据类型.现今主流的编译器中,对64为整型的支持也是标准不一,形态各异.一般来说,64位整型的定义方式有long long和__int64两种(VC还 ...
- DOM操作——JavaScript怎样添加、移除、移动、复制、创建和查找节点
(1). 创建新节点 createDocumentFragment() // 创建一个DOM片段 createElement() // 创建一个具体的元素 createTextNode() // 创建 ...
- [Java]类的生命周期(上)类的加载和连接[转]
本文来自:曹胜欢博客专栏.转载请注明出处:http://blog.csdn.net/csh624366188 类加载器,顾名思义,类加载器(class loader)用来加载 Java 类到 Java ...
- Codeforces Round #375 (Div. 2) B. Text Document Analysis 模拟
B. Text Document Analysis 题目连接: http://codeforces.com/contest/723/problem/B Description Modern text ...
- FCKeditor如何升级CKEditor及使用方法
之前编辑器用的是FCKeditor,因为项目原因需要升级为最新版本4.2.2,发现是已经更名为CKEditor. 百度了一下,据官方的解释,CK是对FCK的代码的完全重写. 项目环境是asp.net的 ...
- MikroTik RouterOS使用VirtualBox挂载物理硬盘作为虚拟机硬盘进行安装
说明:这一切似乎在Windows下更好操作.虚拟机操作不是难点,难点在于虚拟磁盘的转换挂载 一.先挂载硬盘 # 创建虚拟镜像并映射到物理硬盘 cd "c:\Program Files\Ora ...
- HDU 4818 RP problem (高斯消元, 2013年长春区域赛F题)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4818 深深地补一个坑~~~ 现场赛坑在这题了,TAT.... 今天把代码改了下,过掉了,TAT 很明显 ...
- echarts 去掉网格线
去掉 xAxis : [ splitLine:{ show:false }], yAxis : [ splitLine:{ show:false }]
- 《Linux设备驱动开发详解(第3版)》(即《Linux设备驱动开发详解:基于最新的Linux 4.0内核》)--宋宝华
http://blog.csdn.net/21cnbao/article/details/45322629
- Java---16---多线程---死锁
死锁: 概念: 所谓死锁: 是指两个或两个以上的进程在执行过程中,因争夺资源而造成的一种互相等待的现象,若无外力作用.它们都将无法推进下去.此时称系统处于死锁状态或系统产生了死锁,这些永远在互相等待的 ...