ol,ul,li标记 - TsingYiPontifex/html5 GitHub Wiki

HTML5-ol,ul,li标记

知识点

  • ol(有序列表)
  • ul(无序列表)
  • li(列表项目)

ol

ol是有序列表的标记。当在网页上要罗列一些列表内容时,ol标记提供了一种 顺序显示的方法,比如描述做一道炒菜的工序时,则需要使用ol标记标出前后 的工作顺序(因为盐和酱油的顺序不能放错)。 简单地说,就是当要强调一些并行内容的前后顺序时使用ol标记。

标记属性

  • reversed
  • 显示序号进行倒序显示,比如:正序1234567,倒序7654321
  • start
  • 指定第一个项目的序号,默认是1开始
  • type
  • 列表标记的表现方式,默认是数字,也可以指定为字母,罗马数字等等(例:1,a,A,i,I)
<h1>四喜丸子做法</h1>
<ol start="3" type="a">
    <li>把猪肉剁碎</li>
    <li>放入盆中,和鸡蛋搅拌5分钟</li>
    <li>团成肉团</li>
    <li>下油锅炸3分钟</li>
    <li>出油锅,放置1小时</li>
    <li>蒸锅蒸15分钟</li>
    <li>完成</li>
</ol>

ul

当列表内容不用强调顺序时,则可以使用ul标记,使用方法和ol标记完全一样,仅仅是不显示 项目的序号而已。

<h1>我喜欢的书籍</h1>
<ul>
    <li>HTML5精通入门</li>
    <li>Web开发10日通</li>
    <li>PHP开发大全</li>
    <li>iPhone手机开发概要</li>
</ul>

li

li标记是ol和ul标记的子标记,记述每一个列表的内容。

标记属性

  • value
  • 当列表标记是ol的时候使用,指定列表的值内容。
<h1>我的成绩表</h1>
<ol>
    <li value="1">语文:90</li>
    <li value="2">数学:85</li>
    <li value="3">英语:95</li>
</ol>

源代码

小马视频频道(优酷)

http://i.youku.com/komavideo

⚠️ **GitHub.com Fallback** ⚠️