使用跨浏览器解决方案设置一个列表项标记的图像

实例解析：

ul:

　●　设置列表样式类型为没有删除列表项标记

　●　设置填充和边距0px（浏览器兼容性）

ul中所有li:

　●　设置图像的URL，并设置它只显示一次（无重复）

　●　您需要的定位图像位置（左0px和上下5px）

　●　用padding-left属性把文本置于列表中

新建文件

                    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
ul
{
	list-style-type:none;
	padding:0px;
	margin:0px;
}
ul li
{
	background-image:url("https://img.php.cn/upload/article/000/000/015/5c6e720242040312.gif");
	background-repeat:no-repeat;
	background-position:0px 5px; 
	padding-left:14px;
}
</style>
</head>

<body>
<ul>
<li>PHP</li>
<li>JavaScript</li>
<li>MySQl</li>
</ul>
</body>
</html>                

提交重置代码

自动运行

使用跨浏览器解决方案设置一个列表项标记的图像

全部评论我要评论

全部笔记发布笔记