这是我正在尝试的应用程序示例。 其 GUI 在 IE10(无兼容模式)中应与在 IE9 中相同。但在 IE10 中，“ADD”标签的背景图像尺寸正在缩小。 我找不到确切的原因。 很少有解决方案建议我必须给出明确的“高度”和“宽度”参数，但这也无济于事。
我不明白我做错了什么。谢谢。 jsp代码如下:
<html>
<head>
<style>
.buttonM{
color: red;
padding-top: 4px;
font-family: "Verdana";
font-size: 8pt;
cursor: hand;
background-image:url("images/buttonM.png");
background-repeat: no-repeat;
}
.buttonMOver{
color: white;
padding-top: 4px;
font-family: "Verdana";
font-size: 8pt;
cursor: hand;
background: url("images/buttonM.png") no-repeat ;
background-repeat: no-repeat;
}
table, th, td{
border: 1px solid black;
}
label{
height: 23;
text-align: center
}
</style>
<script>
function fnButtonClicked(){
alert("button clicked");
}
</script>
<title>trial</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="GENERATOR"
content="Rational® Application Developer for WebSphere® Software">
</head>
<body>
<table>
<tr height="40">
<td>
Name:
</td>
<td>
<input type="text">
</td>
</tr>
<tr height="40">
<td>
Number:
</td>
<td>
<input type="text">
</td>
</tr>
<tr height="40">
<td align="center" colspan="2">
<label class="buttonM"
style="width: 80; height: 23;"
onmouseover="this.className='buttonMOver';"
onmouseout="this.className='buttonM';"
onclick="javascript:showDetailsPopUp();">
ADD
</label>
</td>
</tr>
</table>
</body>
</html>
最佳答案
对我来说，您似乎没有设置元素的宽度参数，因此它被设置为默认值，它仅与您的文本表示形式一样多。当我错过宽度/高度或某些元素时，我通常会遇到此类问题。
尝试在按钮样式中设置宽度和高度参数以及按钮所在的位置。
<label class="buttonM"
style="width: 80px; height: 23px;">
您以像素为单位定义宽度和高度(通常)。这也可能是它。在顶部，yuo 至少以像素为单位定义了它们。后来你好像忘记了。
尝试改变<td align="center" colspan="2">至 <td align="center" colspan="2" width="80" height="23">
尝试为标签类添加宽度:
label{
height: 23 px ; <-- missing px unit
text-align: center;
width: 80 px ;
}
你也可以定义你的 TR 标签来避免重复写同样的东西:
tr{
height: 40px;
}
以后修改东西会更简单。
您还可以更改 padding-top: 4px;至:padding: 4px 20px 4px 20px;这里:
.buttonM{
color: red;
padding-top: 4px;
关于html - 从 IE9 到 IE10 的背景图像尺寸减小(java 代码)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29625758/