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. 发布Web端

    1.右键发布 2.配置文件,选择自定义 3.填写配置名称 4.选择本地目录 5.最后发布

  2. Hadoop系列之（二）：Hadoop集群部署

    1. Hadoop集群介绍 Hadoop集群部署,就是以Cluster mode方式进行部署. Hadoop的节点构成如下: HDFS daemon:  NameNode, SecondaryName ...

  3. 导入导出CSV

    const string dataPath = @"D:\Users\jin_h\Documents\Visual Studio 2013\Projects\ConsoleApplicati ...

  4. [Go] Http包 使用简介

    请求的结构 HTTP 的交互以请求和响应的应答模式.Go 的请求我们早就见过了,handler 函数的第二个参数 http.Requests.其结构为: type Request struct { M ...

  5. 导出文件在IE和火狐中文件名乱码问题的解决

    $ua = $_SERVER["HTTP_USER_AGENT"]; $filename = "客户数据.xls"; $encoded_filename = u ...

  6. 如何自定义 maven中的archetype

    1.首先使用eclipse创建一个新的maven project,然后把配置好的一些公用的东西放到相应的目录下面 比如说会将一些常用的java代码存放到src/main/java目录下面: 会将一些通 ...

  7. 为什么我不再用 .NET 框架

    .NET平台很棒.真的很棒.直到它不再那么棒.我为什么不再用.NET?简单来说,它限制了我们选择的能力(对我来说很重要),转移了我们的注意力,使得我们向内认知它的安全性,替代了帮助我们认知外面广阔世界 ...

  8. C#各种泛型集合体验

    本篇体验除Queue<T>和Stack<T>之外的其它泛型集合. SortedList<TKey, TValue> SortedList<TKey, TVal ...

  9. Error opening wax scripts: loading wax stdlib: bad header in precompiled chunk

    在64位ios操作系统中使用lua报错. Error opening wax scripts: loading wax stdlib: bad header in precompiled chunk ...

  10. JS 日期实用方法

    var DateUtil = function(){ /** * 判断闰年 * @param date Date日期对象 * @return boolean true 或false */ this.i ...