0

我有一个要为其添加背景图像的链接标签。现在我为背景指定了宽度和高度，即图像的宽度和高度。问题是浏览器不会将背景图像调整为指定的大小，它会忽略它们。这是我的代码：有什么建议吗？

<div align="center" style="font-size: 14px; font-weight: bold; font-family: Arial,   
Helvetica, sans-serif;">
<a id="displayText" href="javascript:toggle();" title="UK referral system credits" 
     style="background: url(images/earnings.png) no-repeat center; width: 150px; 
     height: 40px;">Show my earnings</a>
<iframe id="toggleText" style="display: none;" frameborder="0" height="700" 
    src="http://v4m.mobi/cwf/facebook/uk/user_temp_credits_earned.php"; target="_blank"   
    align="center" width="300" scrolling="Auto"; bgcolor="#C9D3DE"> </iframe>
</div>

谢谢你

4

4 回答 4

1

您可以使用背景大小语法

下面可能会有所帮助
http://www.w3.org/TR/css3-background/#the-background-size

于 2012-05-22T13:59:27.403 回答
1

首先，您应该将样式规则移动到外部 .css 文件中。它不仅会使您的代码更易于阅读，而且可以更好地分离关注点。

其次，除非您使用 CSS3background-size属性，否则您不能明确设置背景图像的大小。它将是原始图像大小的 100%，并且与作为背景的元素的大小完全分开。

要使用background-size，试试这个：background-size: 150px 40px;。请注意，这在 IE8 或更低版本中不起作用。

于 2012-05-22T13:59:38.207 回答
1

像这样添加“显示：块”：

<a id="displayText" href="javascript:toggle();" title="UK referral system credits" 
     style="background: url(images/earnings.png) no-repeat center; width: 150px; 
     height: 40px; display: block;">Show my earnings</a>
于 2012-05-22T14:02:20.530 回答
0

你需要设置

background-size: 150px 40px;
于 2012-05-22T14:00:09.233 回答