HTML/CSS - 从背景图像自动设置高度宽度？

Question

Longshot...我不认为这是可能的，但我之前曾感到震惊!

我锚定标签，所有标签都有背景图片，宽度均为 300 像素，但高度各不相同。无论如何设置这些而不必实际输入高度？将其设置为 bg url 的尺寸？

谢谢!

我不认为人们理解 - 我急于提出问题是我的错。

以代码为例:

#ex-1 {width: 300px; height: 410px; background: url('/image-1.jpg');}
#ex-2 {width: 300px; height: 420px; background: url('/image-2.jpg');}
#ex-3 {width: 300px; height: 430px; background: url('/image-3.jpg');}
#ex-4 {width: 300px; height: 440px; background: url('/image-3.jpg');}

<a href="#" id="ex-1"></a>
<a href="#" id="ex-2"></a>
<a href="#" id="ex-3"></a>
<a href="#" id="ex-4"></a>

我不想设置高度，它仅使用 CSS 自动设置。我不想使用图片标签。

我不确定这是否可能，我想是不可能的。

谢谢

Answer 1

一个简单的方法是添加这样的图像，然后将其隐藏我使用 visibility:hidden http://jsfiddle.net/gztpsfkw/1/

我刚刚看到您不想使用 <img>标签，但至于这里图像被隐藏并且占用了空间。

 <a href="#"><img src="http://placekitten.com/300/301" />aa</a>

并应用CSS

a{
display:block;
background-image:url('http://placekitten.com/300/301');
width:100px;
height:auto;
}

img{
visibility:hidden;
}