无序列表:

1. unordered list 以<ul>开头,以</ul>结果.

每个list item 以<li> tag开头.

2. 样式: bullet(小黑圆圈)

Choose List Item Marker

The CSS list-style-type property is used to define the style of the list item marker:

<ul style="list-style-type:disc"> 表示bullet,小黑点 •

<ul style="list-style-type:circle">空心圆圈 °

<ul style="list-style-type:square"> 实心方块

<ul style="list-style-type:none"> 无marker

备注: style="list-style-type:none"的语法可以换为 type="none",更简单.但支持的样式也更少.

extras:

CJK区域:

一,二,三: style="list-style-type:cjk-ideographic"或者cjk-decimal

天干:甲乙丙丁: cjk-heavenly-stem

地支:子丑寅卯: cjk-earthly-branch

很多种其他marker:

<li style="list-style-type: disc">disc</li>
<li style="list-style-type: circle">circle</li>
<li style="list-style-type: square">square</li>
<li style="list-style-type: decimal">decimal</li>
<li style="list-style-type: decimal-leading-zero">decimal-leading-zero</li>
<li style="list-style-type: lower-roman">lower-roman</li>
<li style="list-style-type: upper-roman">upper-roman</li>
<li style="list-style-type: lower-greek">lower-greek</li>
<li style="list-style-type: lower-latin">lower-latin</li>
<li style="list-style-type: upper-latin">upper-latin</li>
<li style="list-style-type: armenian">armenian</li>
<li style="list-style-type: georgian">georgian</li>
<li style="list-style-type: lower-alpha">lower-alpha</li>
<li style="list-style-type: upper-alpha">upper-alpha</li>
<li style="list-style-type: none">none</li>
<li style="list-style-type: inherit">inherit</li>
<li style="list-style-image: url('eyes.gif')">list-style-image: url('eyes.gif')</li>

最后一个可以用服务器上的图片作为marker.


3. 语法

<ul>内嵌套<li>,如:

<ul>

  <li>list1</li>

  <li>list2</li>

</ul>

<li>内再嵌套list必须先声明一个ol或者ul标签,如果声明多个,按最后面的.

如:

<ul>

  <li>list1

    <ul>

      <li>list1-1</li>

      <li>list1-2</li>

    </ul>

  </li>

  <li>list2</li>

</ul>

  有序列表

1. ol tag

2. list item marker类型

<ul type="none">同无序列表

type="1" 用数字表示

A/a 大小写字母

I/i 大小写罗马字母


[HTML] HTML Lists的更多相关文章

  1. [LeetCode] Intersection of Two Linked Lists 求两个链表的交点

    Write a program to find the node at which the intersection of two singly linked lists begins. For ex ...

  2. [LeetCode] Merge k Sorted Lists 合并k个有序链表

    Merge k sorted linked lists and return it as one sorted list. Analyze and describe its complexity. 这 ...

  3. [LeetCode] Merge Two Sorted Lists 混合插入有序链表

    Merge two sorted linked lists and return it as a new list. The new list should be made by splicing t ...

  4. 21. Merge Two Sorted Lists —— Python

    题目: Merge two sorted linked lists and return it as a new list. The new list should be made by splici ...

  5. 【leetcode】Intersection of Two Linked Lists

    题目简述: Write a program to find the node at which the intersection of two singly linked lists begins. ...

  6. [LintCode] Intersection of Two Linked Lists 求两个链表的交点

    Write a program to find the node at which the intersection of two singly linked lists begins. Notice ...

  7. [LintCode] Merge Two Sorted Lists 混合插入有序链表

    Merge two sorted (ascending) linked lists and return it as a new sorted list. The new sorted list sh ...

  8. ubuntu 解决 “E: Problem with MergeList /var/lib/apt/lists/”错误

    这种错误的意思:无法解析或打开软件包的列表或是状态文件. 出现的原因:无法解析或打开软件包列表多数情况是安装的软件与本身系统有一些冲突之类的问题,或者曾在更新软件源或下载软件的时候意外中断造成的. 解 ...

  9. No.023:Merge k Sorted Lists

    问题: Merge k sorted linked lists and return it as one sorted list. Analyze and describe its complexit ...

  10. No.021:Merge Two Sorted Lists

    问题: Merge two sorted linked lists and return it as a new list. The new list should be made by splici ...

随机推荐

  1. windows加固

    1. 账户管理和认证授权 1.1 账户 默认账户安全 禁用Guest账户. 禁用或删除其他无用账户(建议先禁用账户三个月,待确认没有问题后删除.) 操作步骤 打开 控制面板 > 管理工具 > ...

  2. Java项目引用外部jar包时,使用bat启动

    1.将项目导出为jar包 1)点击项目—>右击—>点击Export—>进入export页面 2)点击JAR file——>Next——>勾选项目——>选择jar包存 ...

  3. 2、LwIP协议栈规范翻译——协议层

    2.协议层 TCP/IP套件中的协议是以层次的方式设计的,其中每个协议层解决了通信问题的单独部分.这种分层可以用作设计协议实现的指南,因为每个协议可以与另一个分开实现.然而,以严格分层的方式实现协议可 ...

  4. Centos7.1环境下搭建BugFree

    环境准备: 系统 配置 IP Centos7.1 1核2G+60GB硬盘 10.10.28.204 1. 安装apache yum install httpd  2. 安装mysql yum inst ...

  5. Flask项目示例目录

    Flask不同于Django,Django在创建程序时自动得到必要的目录文件,而Flask则只有一个空文件夹,所以关于Flask项目的目录我们需要自行配置. 首先利用pycharm创建一个项目,在根目 ...

  6. CSS-对于IE的兼容问题处理

    css兼容问题 兼容问题 1.文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3px,ff下实际占高17px,上留白 ...

  7. Eclipse安装fatjar(不用自己下载fatjar包)

    .安装Eclipse-jee-luna-SR2-win32-x86_64版本的插件支持 方法如下: Help -> Install New Software... -> Work with ...

  8. redis内存不够 : OOM command not allowed when used memory > ‘maxmemory’

    Redis内存不够,报错. 三种解决思路 注:如修改了配置文件需重启redis 1. 增加redis内存,修改redis.conf(集群中为redis-env.sh),默认为1024MB,增加到合适的 ...

  9. php 实现简拼

    <blockquote>model::::::::::::::::::::::::::::: function getFirstCharter($str){if(empty($str)){ ...

  10. 查看容器IP地址

    我们可以通过以下命令查看容器运行的各种数据 docker inspect 容器名称(容器ID)  也可以直接执行下面的命令直接输出IP地址 docker inspect --format='{{.Ne ...