我可以在CSS:before /:after伪元素中更改图像的高度吗?

假设我想使用图像修饰指向某些文件类型的链接。我可以声明我的链接为

<a href='foo.pdf' class='pdflink'>A File!</a>

然后像CSS

.pdflink:after { content: url('/images/pdf.png') }

现在,这很好用,除非pdf.png不是我的链接文本的合适大小。

我希望能够告诉浏览器缩放:after图像,但是我终生无法找到正确的语法。还是像背景图片那样无法调整大小?

ETA:我倾向于a)将源图像的大小调整为服务器端的“正确”大小,和/或b)更改标记以简单地内联提供IMG标签。我试图避免这两件事,但是它们听起来比单纯用CSS做事更具兼容性。答案我原来的问题似乎是“你可以

排序的 做到这一点,有时”。

回答:

background-size允许调整。但是,您仍然需要指定块的宽度和高度。

.pdflink:after {

background-image: url('/images/pdf.png');

background-size: 10px 20px;

display: inline-block;

width: 10px;

height: 20px;

content:"";

}

以上是 我可以在CSS:before /:after伪元素中更改图像的高度吗? 的全部内容, 来源链接: utcz.com/qa/412834.html

回到顶部