Retina CSS3伪元素上的图像

我一直使用背景大小和媒体查询成功地使用Smashing Magazine描述的视网膜图像技术。Retina CSS3伪元素上的图像

但是，我刚刚发现了一种情况，这种技术看起来不起作用：造型CSS3伪元素。

<p>test</p> 

p:before { 
    content: url('http://file.rspreprod.fr/BNP/Maps/img/web/[email protected]'); 
    background-size: 15px 25px; 
    width:15px; 
    height:25px; 
}

检查这个JS小提琴： http://jsfiddle.net/t29xzxmw/2/

在iPhone和Android，图像不清澈，因为它应该是。您是否知道将视网膜图像应用于CSS3伪元素的解决方案？

来源

2014-10-09 Rémy DAVID

是'号码：before'规则包含适当的媒体查询中？ – 2014-10-09 16:02:33

在我的代码中，是的，在这个例子中，为了简单起见，我删除了媒体查询。 – 2014-10-09 16:05:43

这不起作用。它不接受背景大小。它不会因为它不是背景图片。 – Christina 2014-10-09 16:07:49

使用的background代替content:""

p:before { 
    content:""; 
    background:url('http://file.rspreprod.fr/BNP/Maps/img/web/[email protected]'); 
    background-size: 15px 25px; 
    width:15px; 
    height:25px; 
}

来源

2014-11-02 16:27:52

Retina CSS3伪元素上的图像

回答

相关问题