0

我在 WordPress 网站中使用提交按钮。这是我的按钮 HTML:

<input class="greenbut" onclick="set_srch();" type="image" alt="Search" value="Search"/>

style.css我有:

.search_box .greenbut
{
    width: 50px;
    height: 19px;
    text-align: center;
    color: #333333;
    line-height: 30px;
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 0px;
    padding-left: 15px;
    font-family: DroidSansRegular;
    font-size: 13px;
    margin-top: 31px;
    margin-left: 0px !important;
    float: left;
    cursor: pointer;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-image: none;
    background-attachment: scroll;
    background-repeat: repeat;
    background-position-x: 0px;
    background-position-y: 0px;
    background-size: auto;
    background-origin: padding-box;
    background-clip: border-box;
    background-color: rgb(137, 206, 71);
}

在其他浏览器中没问题,但在 IE 中是这样的:

按钮损坏的图像

在 Chrome 和 Firefox 中,它看起来像这样:

搜索按钮的屏幕截图

我怎样才能为 IE 修复它?

4

3 回答 3

2

的要点type="image"是充当服务器端图像映射,其中图像的 URL 由src属性指定。您没有其中之一,您的所有样式都是使用 CSS 完成的,并且您依赖浏览器以alt一致的方式处理丢失的图像及其替代 ( ) 内容。由于 IE 显示了一个图标,指示除了替代文本之外缺少图像,这将不起作用。

改用真正的提交按钮:

<input class="greenbut" type="submit" value="Search">

您可能需要调整 CSS 以补偿不同的默认边框/边距/填充/等。

于 2013-09-06T16:14:53.260 回答
-1

尝试使用<input type="submit">

于 2013-09-06T16:11:04.260 回答
-2

尝试添加<input type="hidden" alt="Search" value="Search" />alt="Search" 从您的代码中删除

于 2013-09-06T16:14:23.723 回答