我的按钮在除 IE 10 之外的所有浏览器(Firefox、Safari、Chrome)中看起来都很好(我在装有 Windows 8.1 的两台不同计算机上进行了测试)。图像在 IE 中看起来有点低,而其他浏览器则在中间。
IE:
火狐:
CSS:
#checkout {
background-image: url(../img/checkout.jpg);
border: 1px solid #D6D6D6;
float: right;
width: 184px;
height: 29px;
}
HTML:
<input type='submit' id='checkout' class='jcart-button' value='' />
我试过使用:
line-height: 29px;
此外,我注意到当我使用 input type='image'
时它工作正常,但问题是,我需要能够在悬停时显示不同的图像。 onMouseClick
可以解决问题,但没有 javascript 就无法工作。我也需要一些无需 javascript 即可工作的东西。
编辑:
删除了除 #checkout
部分之外的所有 css,但我仍然遇到问题。所以我认为这是 #checkout
css 或 HTML 部分的问题。
演示: link
最佳答案
经过数小时的调试后找到了我的答案:)
我所要做的就是从图像中删除边框并使用:
border: none;
希望对其他人有所帮助!
关于javascript - 图像在 IE 中显示较低,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24131736/