详解HTML5中ol标识的用法

日期:2020-12-11 类型:科技新闻 

关键词:微信小程序页面设计,python小程序,小程序首页模板,如何建立微信小程序,怎么做微信小程序

界定和用法
<ol> 标识界定井然有序目录。
HTML 4.01 与 HTML 5 之间的差别
在 HTML 4.01 中,不赞同应用 "start" 特性,在 HTML 5 中是容许的。
在 HTML 4.01 中,不赞同应用 "compact" 和 "type" 特性,在 HTML 5 中,已不适用这两个特性。
提醒和注解
提醒:请应用 CSS 来界定目录的种类。
事例

XML/HTML Code拷贝內容到剪贴板
  1. <ol>  
  2.    <li>Coffee</li>  
  3.    <li>Tea</li>  
  4. </ol>  
  5.   
  6. <ol>  
  7.    <li start="60">Coffee</li>  
  8.    <li>Tea</li>  
  9. </ol>  


HTML5出示的OL标识编号操纵
OL这标识是以井然有序目录的方式来显示信息数据信息的,它会全自动为数据信息再加序号。可是有时数据信息其实不是从1刚开始序号的,或序号是倒序排序的,又或序号是彻底杂乱无章的,这时候就必须用到HTML5中对OL标识出示的1些主要参数来设定。但是遗憾的是,现阶段它还兼容问题IE。
  如今,大家有1个这样的HTML文本文档

XML/HTML Code拷贝內容到剪贴板
  1. <ol>  
  2.   <li>马铃薯</li>  
  3.   <li>洋葱</li>  
  4.   <li>胡萝卜</li>  
  5.   <li>里脊肉</li>  
  6. </ol>  

  它会显示信息成这样

这些编号默认设置是从1刚开始递增的。假如必须让OL标识中的编号倒序排序呢?这要是对OL加个reserved特性便可。

XML/HTML Code拷贝內容到剪贴板
  1. <ol reversed="reversed">  
  2.   这个是承继自XHTML的写法,实际上能够立即写   
  3. <ol reversed>  

  这就早已合乎HTML5的规范了,再加这个后便可以获得这样的結果

Chrome和Firefox中全是没难题的,可是IE兼容问题它(最少我检测了IE10是兼容问题的)。嘛,咱如今只是掌握1下这个作用,至于IE实不完成临时就已不探讨了。
  接着,假如不想让它从1刚开始呢?例如要让它从3刚开始,大家便可以给OL标识加上start特性,并设定为3。

XML/HTML Code拷贝內容到剪贴板
  1. <ol start="3">  

最终,针对彻底无规律性却又是井然有序的物品如何做呢?例如我要2、1、3、4,这样的排序如何办?实际上,要是给LI再加value特性便可以操纵这个编号。

XML/HTML Code拷贝內容到剪贴板
  1. <ol>  
  2.   <li value="2">马铃薯</li>  
  3.   <li value="1">洋葱</li>  
  4.   <li value="3">胡萝卜</li>  
  5.   <li value="4">里脊肉</li>  
  6. </ol>