请选择 进入手机版 | 继续访问电脑版

CSS中list-style 属性使用教程

[复制链接]
查看3546 | 回复1 | 2019-7-22 07:08 | 显示全部楼层 |阅读模式
CSS中list-style 属性使用教程
实例
把图像设置为列表中的列表项目标记:
  1. ul
  2.   {
  3.   list-style:square inside url('/i/arrow.gif');
  4.   }
复制代码
定义和用法
list-style 简写属性在一个声明中设置所有的列表属性。
说明
该属性是一个简写属性,涵盖了所有其他列表样式属性。由于它应用到所有 display 为 list-item 的元素,所以在普通的 HTML 和 XHTML 中只能用于 li 元素,不过实际上它可以应用到任何元素,并由 list-item 元素继承。
可以按顺序设置如下属性:
  • list-style-type
  • list-style-position
  • list-style-image
可以不设置其中的某个值,比如 "list-style:circle inside;" 也是允许的。未设置的属性会使用其默认值。
admin | 2019-7-22 07:10 | 显示全部楼层
list-style属性使用案例:
  1. <html>
  2. <head>
  3. <style type="text/css">
  4. ul
  5. {
  6. list-style: square inside url('/i/eg_arrow.gif')
  7. }
  8. </style>
  9. </head>

  10. <body>
  11. <ul>
  12. <li>咖啡</li>
  13. <li>茶</li>
  14. <li>可口可乐</li>
  15. </ul>
  16. </body>
  17. </html>
复制代码
效果如图:
1015.png
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

UID
1
贡献
387
丢币
38902
主题
4607
回帖
116
注册时间
2018-9-25
最后登录
2024-3-30