使用背景图像的框架

Question

我在我的图像中放置了一个框架。

我为背景图像创建了一个 CSS，它是框架的图像，但他必须有一个 x 填充才能看到框架。

img.frame
{
    background-image:url('http://bit.ly/k8g8zz');
    background-repeat:no-repeat;
    background-position: center;
    background-size: 100%;
    padding:23px 14px 60px;
}

我不能在另一个div里面使用一个，因为我需要这个图片是一个带有标题的链接，而W3C不能是div标签内的一个。

如果可能，请更改 jsFiddle 并将链接发送给我

请参阅此处的完整代码。

正如您在 jsFiddle 中看到的那样，框架的大小不正确。她需要与图像一起增长并具有填充。

谢谢大家的帮助。

Answer 1

你几乎拥有它！ 只需设置background-size的两个尺寸；

background-size: 100% 100%;

http://jsfiddle.net/vLBXH/

Answer 2

您不能在 CSS，AFAIK 中为背景图像设置宽度和高度。 如果您使用固定宽度的图像 (PNG)，您还应该拥有匹配大小的图像。 另一种方法可能是仅使用 CSS 对框架进行样式设置，或者在链接图像周围添加一个框架标签，然后您可以对其进行样式设置，例如：

<div class="img_frame">
    <a href="#nohref"><imgr src="#noimg" /></a>
</div>