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. SDC信息统计分析系统ETL工具的研究与实现[专业:计算机应用技术]

    SDC信息统计分析系统ETL工具的研究与实现[专业:计算机应用技术] http://www.docin.com/p-265530271.html

  2. collectionView代理方法快速设置cell大小上下左右间隔

    #define JianGe 25 #define GeShu 4 #define ScreenWidth ([UIScreen mainScreen].bounds.size.width) #def ...

  3. Lambda的分类(语句Lambda和表达式Lambda)

    学习自 <C#本质论> Overview 在上一文中,我们简而又简的了解了一下,匿名方法和Lambda表达式,关于匿名方法这里暂且不表,本文我们来更加详细的了解一下Lambda表达式. 本 ...

  4. 利用Windows7自带的截图工具获取菜单截图的步骤

    打开截图工具后,按 Esc,然后打开要捕获的菜单. 按 Ctrl+PrtScn. 单击“新建”按钮旁边的箭头,从列表中选择“任意格式截图”.“矩形截图”.“窗口截图”或“全屏幕截图”,然后选择要捕获的 ...

  5. JDBC之 连接池

    JDBC之 连接池 有这样的一种现象: 用java代码操作数据库,需要数据库连接对象,一个用户至少要用到一个连接.现在假设有成千上百万个用户,就要创建十分巨大数量的连接对象,这会使数据库承受极大的压力 ...

  6. Django-Filter源码解析一

    Django Filter源码解析 最近在看Django-FIlter项目的源码,学习一下别人的开发思想: 整体介绍 首先,我从其中一个测试用例作为入口,开始了debug之路,一点一点的断点,分析它的 ...

  7. 关于java中的锁(转)

    对于锁一直处于比较模糊的状态,最近一天晚上偶然想看看,就翻了几本书,然后弄明白了一些概念,有一些仍然没明白,例如AQS,先把搞明白的记录一下吧. 什么是线程安全? 当多个线程访问一个对象时,如果不用考 ...

  8. jQuery自己定义绑定的魔法升级版

    jQuery自己定义绑定 首先让我们来看看jQuery的自己定义绑定的用法,你能够使用bind或者live来订阅一个事件(当然1.7以后也能够使用on了),代码例如以下: $("#myEle ...

  9. STM32F4 SPI with DMA

    STM32F4 SPI with DMA A few people have requested code, so I thought I’d post the code showing how I’ ...

  10. DMA/TIM capture

    This is a more free standing example measuring the LSI (TIM5_CH4 internally) and demonstrating DMA/T ...