如何使背景图像适合包含锚点元素？

我试图设计一个图像背景的链接，问题是如果图像太大，我如何适应使用CSS的锚点的宽度和高度？如何使背景图像适合包含锚点元素？

<a href="#"></a> 
<style> 
a 
{ 
    display: block; 
    padding: 5px 12px; 
    border: 1px solid black; 
    width: 10px; 
    height: 10px; 
    background-image: url('/Scripts/images/downarrow_blue.png'); 
    } 
</style>

TIA，丽娜在CSS 2.1

来源

2010-04-21 Lina

背景图片不能调整大小，但CSS 3支持background-size属性已经不被广泛实施。

background-size: 10px 10px;

明显的替代方案是只使用一个<img>标签：

<a href="#"><img src="mybg.png" alt="" style="width:10px; height:10px" /></a>

但你可能因为不这样做也无妨这样一个道理，对不对？

其他替代方案可能是

的<a>元调整到图像的大小，而不是。
在本地调整图像大小并将其上传到不同的文件名下。
使用服务器端预处理器（如PHP或ASP）以您想要的大小传送图像。

来源

2010-04-21 10:09:48

yes我实际上有一个使用它作为背景的理由，因为我必须更改悬停上的图片，谢谢:) – Lina 2010-05-11 09:45:53

对于我来说background-size是解决方案，但我也必须使用宽度和高度属性。 – erdomester 2013-04-13 07:34:41

如果您不知道图像的大小（或任何其他您正在使用的元素），则代码“background-size：100％100％;”应该管用。 – 2014-03-17 18:27:37

如何使背景图像适合包含锚点元素？

回答

相关问题