0

我在具有 href 属性的锚元素上插入文本时遇到问题： 

<a href="myfile.pdf"> Contact Us</a>

我正在尝试编写 css 以使图标出现在联系我们之后以及任何锚标记中的任何文本：

a[href$=".pdf"]:after { 
width: 16px;
height: 16px;
content: url('/_assets/img/document-type-icons-2.png') no-repeat -84% 0;
}

它不是这样工作的。我如何编写我的 CSS 来实现这一点？

好的，我开始工作了，但是如何设置背景属性的样式，例如无重复和 -84% 0。

它不断重复

4

2 回答 2

1

内容仅接受文本。对于空间等特殊包机，您必须使用十六进制格式。我改变它喜欢跟随和工作。但要增加宽度，请重复空格十六进制（\00a0）。

a[href$=".pdf"]:after {
background: url('http://cdn1.iconfinder.com/data/icons/fatcow/32x32/file_extension_pdf.png') ;
width: 40px;
height: 40px;
content: "\00a0\00a0\00a0\00a0\00a0"
}
于 2013-03-26T18:03:01.880 回答
1

将图像设置background-image为您的伪元素，或者从属性:after中删除任何内容。应该包含一个字符串（或多个字符串）或包装在函数中的图像 url（然后图像将像真实元素一样插入）。url(path)contentcontenturl()IMG

考虑到，为了使生成的伪元素可见（如果你将使用background-image而不是content: url(path)），content属性应该至少包含空字符串（""）。

于 2013-03-26T17:50:47.440 回答