本文详细解析了CSS中a标签的背景属性设置方法，包括透明背景、背景图片的定位及重复方式等。并通过具体实例展示了如何使用伪类选择器对特定类型的链接应用样式。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<style>
a[href $='.pdf'] {
padding-right: 20px;
background: transparent url(http://www.iconpng.com/png/lozengue-filetype/pdf.png) no-repeat right;
background-size: contain;
}
</style>
<body>
<a href="godkun.pdf">pdf文件</a>
</body>
</html>示意图如下:
对background进行分析:
transparent是指背景颜色设置为透明色- 背景
url图片是默认填的区域大小为width的值，如果是边框盒模型，就是包括padding和border no-repeat是不重复图片来填充区域，只填充一个right是指填充在背景区域的最右侧
对a[href $='.pdf']进行分析：
href指定a标签的链接类型$表示结束的位置，用于正则$='.pdf'是指匹配以.pdf结尾的href链接
扫一扫
9万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
