Rumah > hujung hadapan web > tutorial css > CSS:list-style-image的使用详解

CSS:list-style-image的使用详解

黄舟
Lepaskan: 2017-06-29 10:13:26
asal
3896 orang telah melayarinya

你对CSS list-style-image属性的用法是否了解,这里向大家描述一下,list-style-image属性使用图像来替换列表项的标记,这个属性指定作为一个有序或无序列表项标志的图像。

CSS list-style-image属性列表图标

定义和用法

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

说明

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

注释:请始终规定一个"list-style-type"属性以防图像不可用。

1635.png

实例

把图像设置为列表中的项目标记:

ul  
{  
list-style-image:url("/i/arrow.gif");  
list-style-type:square;  
}
Salin selepas log masuk

浏览器支持

所有浏览器都支持list-style-image属性。

注释:任何的版本的InternetExplorer(包括IE8)都不支持属性值"inherit"。

可能的值

1636.png

语法:

list-style-image : none | url (url)
Salin selepas log masuk

参数:

none :  不指定图像
url :  使用绝对或相对地址指定背景图像

说明:

设置或检索作为对象的列表项标记的图像。
若list-style-image属性为none或指定图像不可用时,list-style-type属性将发生作用。
对应的脚本特性为listStyleImage。请参阅我编写的其他书目。

示例:

ul.out { list-style-position: outside; list-style-image: url("images/ie.gif"); }
Salin selepas log masuk

 

Atas ialah kandungan terperinci CSS:list-style-image的使用详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
css
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan