2011-10-21 70 views
3

好吧,我承认我在现在玩耍的境界......CSS:是否可以缩放:before {content:url(..)}元素中的图像?

我想达到的目标: 应该有之前被用来在我们的网页应用程序中添加一些元素实用链接加号。
如果此符号根据用户设置的字体大小进行缩放,那就太好了。

我已经试过:

<style type="text/css"> 
    a.addLink:before { 
     content: url('images/add.png'); height: 1.2em;  
    } 
</style> 

<a class="addLink" href="#" onclick="freakyJSFunction">testlink</a> 

可悲的是,高度属性将被忽略。 我知道我可以在每个链接之前插入正常的<img../>,但这不像我们希望的那样可维护。

或者,我可以用花哨的Unicode字符中的一个,例如

content: "\271a"; font-size:1.4em; color:green; 

现在,我将与Unicode的想法(就在IE8测试了这个去...不,IE 8没有按” t显示该字符(“希腊十字”)... :-()...好吧,我会用unicode的想法去,如果我找到一个合适的charakter,显示在IE8中,FF和可能chrome ..

仍然,我不知道我最初的想法是不知何故可行

回答

2

在css3中你有一个background-size财产。

http://jsfiddle.net/jQgQv/7/

但是背景图片不能应用于槽content:,这样就不会在使用:before工作你的情况 - 只是作为一个普通的类。

+0

很酷,谢谢。可悲的是,我们的一些客户非常保守,所以我们会在IE8上停留一段时间,所以我们不能使用css3。不过,很高兴知道 – cypherabe