WEB教程基地:www.91ctc.com为你搭建学习WEB技术的优秀平台
网站地图 加入收藏 设为首页
您的位置:本站首页>>前端样式>>CSS列表样式的设置――列表属性与列表符号类型属性值

CSS列表样式的设置――列表属性与列表符号类型属性值

[ 录入者:91ctc | 时间:2012-02-26 12:09:22 | 作者: 91ctc| 来源:本站原创 | 浏览: 次 ]

列表在网页制作当中十分普遍,如:新闻列表、产品类别列表……甚至导航栏,都用到了列表(html标签为<li>),所以,列表样式也自然显得格外重要,定义不同的列表样式,会让我们得到不同的列表效果。下面我们介绍三个最为常见的列表属性。

list-style-type:设定引导列表项目的符号类型

list-style-image:选择图像作为项目的引导符号

list-style-position: 决定列表项目所缩进的程度

定义列表项目符号类型的语法形式如下:

list-style-type:value

常见的列表符号类型的属性值有:

disc:在文本前面加实心圆

circle:在文本前面加空心圆

square:在文本前面加实心方块

decimal:在文本前面加普通的阿拉伯数字

lower-roman:在文本前面加小写罗马数字

wpper-roman:在文本前面加大写罗马数字

lower-alpha:在文本前面加小心英文字母

wpper-alpha:在文本前面加大写英文字母

none:不显示任何项目符号或编号

例如:

XML/HTML Code复制内容到剪贴板
  1. <head>  
  2. <style type="text/css">  
  3. <!--  
  4. ol{list-style-type:upper-roman;}  
  5. -->  
  6. </style>  
  7. </head>  
  8. <body>  
  9. ……   
  10. <ol>  
  11. <li>***</li>  
  12. <li>***</li>  
  13. <li>***</li>  
  14. </ol>  
  15. ……   
  16. </body>  

 

PS:如果您对本文有纠错、质疑、转载、举报等问题时,请加入到网站Q&Q&群:86783981(验证信息:91ctc.com)提交您的问题,让大伙一块讨论。谢谢您的支持,计算机教程中心网将会一如既往的提供优秀资源助您一臂之力!
关闭】【返回顶部

您可能感兴趣的文章
91ctc.com 网络先锋,引领科技,本站原创作品[转载请注明出处]。网站Q&Q&群:86783981(验证信息:91ctc.com)
Copyright© 2010-2017 计算机教程中心网 . All rights reserved. 苏ICP备11081842号