CSS样式表基础(十一)——有序列表

15、有序列表

对有序列表,list-style-type的值为:

  • lower-roman 小写罗马数字
    ⅰ,ⅱ,ⅲ,ⅳ,ⅴ,ⅵ,ⅶ,ⅷ,ⅸ,ⅹ……
  • upper-roman 大写罗马数字
    Ⅰ,Ⅱ,Ⅲ,Ⅳ,Ⅴ,Ⅵ,Ⅶ,Ⅷ,Ⅸ,Ⅹ……
  • upper-alpha 或 upper-latin 大写英文字母
    A,B,C,D,E,F,G,H,I,J……
  • lower-alpha 或 lower-latin 小写英文字母
    a,b,c,d,e,f,g,h,i,j……
  • lower-greek 小写希腊字母
    α,β,γ,δ,ε,ζ,η,θ,ι,κ……
  • decimal 十进制数
    1,2,3,4,5,6,7,8,9,10……
  • decimal-leading-zero 十进制数,前面带0,如01、02、99
    01,02,03,04,05,06,07,08,09,10……
  • binary 二进制数
    0,01,10,11,100,101,110,111,1000,1001,1010……
  • cjk-ideographic 中文数字一二三四
    一,二,三,四,五,六,七,***,十……
  • cjk-earthly-branch 子丑寅卯
    子、丑、寅、卯、辰、巳、午、未、申、酉、戌、亥……
  • cjk-heavenly-stem 甲乙丙丁
    甲、乙、丙、丁、戊、己、庚、辛、壬、癸……

例:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Sample</title>
<style>
  ol#list_1 {list-style-type:lower-roman;}
  ol#list_2 {list-style-type:upper-roman;}
  ol#list_3 {list-style-type:lower-alpha;}
  ol#list_4 {list-style-type:upper-alpha;}
  ol#list_5 {list-style-type:lower-greek;}
  ol#list_6 {list-style-type:decimal;}
  ol#list_7 {list-style-type:decimal-leading-zero;}
  ol#list_8 {list-style-type:cjk-ideographic;}
  ol#list_9 {list-style-type:cjk-earthly-branch;}
  ol#list_10 {list-style-type:cjk-heavenly-stem;}
</style>
</head>
<body>
<ol id="list_1">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_2">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_3">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_4">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_5">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_6">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_7">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_8">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_9">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
<ol id="list_10">
   <li>第一个列表项</li>
   <li>第二个列表项</li>
   <li>第三个列表项</li>
</ol>
</body>
</html>

图片说明

全部评论

相关推荐

01-28 16:12
中南大学 Java
几年前还没有chatgpt的时候,刷题真的是很痛苦。刷不出来只能看题解,题解有几个问题:第一个是每次看的写题解的人都不一样,很难有一个统一的思路;第二个也是最重要的是,题解只提供了作者自己的思路,但是没有办法告诉你你的思路哪里错了。其实很少有错误的思路,我只是需要被引导到正确的思路上面去。所以传统题解学习起来非常困难,每次做不出来难受,找题解更难受。但是现在chatgpt能做很多!它可以这样帮助你&nbsp;-1.&nbsp;可以直接按照你喜欢的语言生成各种解法的题解和分析复杂度。2.&nbsp;把题和你写的代码都发给它,它可以告诉你&nbsp;你的思路到底哪里有问题。有时候我发现我和题解非常接近,只是有一点点🤏想错了。只要改这一点点就是最优解。信心倍增。3.&nbsp;如果遇到不懂的题解可以一行一行询问为什么要这样写,chatgpt不会嫌你烦。有时候我觉得自己的range写错了,其实那样写也没错,只是chat老师的题解有一点优化,这个它都会讲清楚。4.&nbsp;它可以帮你找可以用同类型解法来做的题。然后它可以保持解法思路不变,用一个思路爽刷一个类型的题。如果题目之间思路又有变化,它会告诉你只有哪里变了,其他的地方还是老思路。5.&nbsp;它也可以直接帮你总结模板,易错点。经过chat老师的指导,我最大的改变是敢刷题了。之前刷题需要先找某一个人写的算法题repo,然后跟着某一个人他的思路刷他给的几个题。如果想写别的题,套用思路失败了,没有他的题解,也不知道到底哪里错了;看别人的题解,思路又乱了。这个问题在二分查找和dp类型的题里面特别常见。但是现在有chat老师,他会针对我的代码告诉我我哪里想错了,应该怎么做;还按照我写代码的习惯帮我总结了一套属于我的刷题模板。每天写题全是正反馈!
明天不下雨了:那我建议可以用 chatgpt atlas 或者 dia 去刷,也可以用 chrome 加个 ai 插件去刷 左边刷题右边 chat 效果很好
AI时代的工作 VS 传...
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务