css list-style-image属性怎么用


本文摘自PHP中文网,作者青灯夜游,侵删。

css list-style-image 属性用于指定图像作为有序或无序列表项的标志。通常使用 list-style-position 属性控制图像标记的位置。需始终规定一个 "list-style-type" 属性以防图像不可用。

css list-style-image属性怎么用

list-style-image 属性使用图像来替换列表项的标记。

基本语法:

1

list-style-image:URL|none;

属性值:

● URL:图像的路径。

● none:默认。无图形被显示。

说明:这个属性指定图像作为一个有序或无序列表项标志。通常使用 list-style-position 属性控制图像相对于列表项内容的放置位置。

注释:请始终规定一个 "list-style-type" 属性以防图像不可用。所有浏览器都支持 list-style-image 属性。

css list-style-image属性 示例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style>

ul

{

list-style-image:url('sqpurple.gif');

}

</style>

</head>

<body>

<ul>

<li>咖啡</li>

<li>茶</li>

<li>可口可乐</li>

</ul>

</body>

</html>

效果图:

1.jpg

以上就是css list-style-image属性怎么用的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

一招搞定css相对原点定位背景图片

css如何设置元素位置不变

值得收藏的css性能优化方法

css中的position是什么意思

css怎么把横着的字竖起来

css怎么把ul文字变成横向排列

css伪类原理是什么

css三种颜色写法是什么

css层叠性重要么

css的盒子模式有什么用

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...