提交按钮顶部的图像图标

时间:2011-11-06 01:50:20

标签: css drupal button submit html

我正在处理Drupal中的提交按钮。我使用从PHP生成的HTMLcode:

<div class="buttons">
    <span class="icon">
        <input type="submit" name="op" id="edit-submit-115" value="Vložiť do košíka"  class="form-submit node-add-to-cart"" />
    </span>
</div>

我希望按钮具有渐变背景,这是通过在CSS中添加一些行来完成的。

background: #F47C20;
background: -webkit-gradient(linear, left top, left bottom, from(#F88E11), to(#F06015));
background: -moz-linear-gradient(top, #F88E11, #F06015);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015'

现在,我想在按钮的顶部放置一个图像图标,靠近文本。我一整天都在寻找一些线索,却找不到任何东西。

可以找到带有按钮的页面here

1 个答案:

答案 0 :(得分:0)

嗯,这是另外两个想法:

  1. 您可以使用多个背景:http://tinkerbin.com/revBP8If

    请注意,我必须删除IE filter属性,因为它导致其余的CSS在Tinkerbin上失败。不幸的是,IE8或更低版本不支持多种背景。

  2. 更兼容的替代方法是使用常规a链接而不是input提交按钮。您可以插入img并将其设置为按钮,但您需要一些Javascript才能提交表单:http://www.javascript-coder.com/javascript-form/javascript-form-submit.phtml