图像按钮显示[提交＆QUOT;在Chrome浏览器顶部的图像

问题描述

我有类似this家伙的，但它发生在Chrome中。

值设置为=，所以对于Firefox的问题的修补程序已经在发挥作用。这只发生在Chrome而不是Firefox中。经由字preSS我的搜索表单主题code是如下：

 ＆LT;形式方法=获取级=搜索框行动=＆LT; PHP代码bloginfo（'URL'）;？＆GT;＆GT;＆LT; D​​IV ID =搜索外形包装＆GT;    ＆LT;输入类型=文本ID =搜索框NAME =S值=ACCESSKEY =4/＆GT;    ＆LT;输入类型=形象NAME =提交ID =searchsubmit级=nothiddenVALUE =/＆GT;    ？＆所述; PHP的如果（get_option（'k2livesearch'））：＆GT;    ＆LT; PHP ENDIF; ？＆GT;＆LT;跨度ID =searchreset称号=＆LT; PHP esc_attr_e（重置搜索，k2_domain'）;？＆GT;＆GT;＆LT; / SPAN＆GT;        ＆所述;跨度的id =searchload＆GT;＆下; /跨度＆GT;
 

解决方案

对不起迟到了，但一个很好的答案可能是有益的所有谁想要提交图片...

嗯，我会说，为什么不尝试用一个真正的提交类型和一些CSS像我下面的例子，也许它没有解决你问的方式，但我认为这是为您解​​决问题的最佳途径，这将是W3C的有效它会在所有的浏览器有没有更好的方式与图像要做到这一点，所以我恳请你试试code我提供的，我希望你会喜欢的方式我会做...

您提交行是：

 ＆LT;输入类型=形象NAME =提交ID =searchsubmit级=nothiddenVALUE =/＆GT;
 

将其更改为一个真正的提交按钮：

 ＆LT;输入类=nothidden类型=提交名称=提交ID =searchsubmit价值=你的价值/＆GT;＆LT;！ -  / /如果需要你的style.css文件来创建你想要添加下面的风格和编辑！ //  - ＆GT;
 

现在好了，你会说：我不希望有一个怪异的标准提交按钮！并且我同意！这就是为什么下面的风格时，CSS将帮助我们使用一个提交类型的图像，请阅读以下我的CSS ...

    input.nothidden {
border-style: none; /** This is needed to remove borders! **/
display: block;
font-size: 11px; /** Define your font size **/
font-weight: bold; /** Define your font weight **/
height: 23px !important; /** Height of your image **/
/** padding: 4px 0 0; - add some padding if needed... **/
text-align: center; /** Where do you want the text? left, right or center?**/
text-decoration: none; /** Don't want a underline or other decorations? **/
width: 91px; /** Width of your image **/
background: url(http://www.hollandiateam.eu/plaatjes/purple_small.gif) no-repeat scroll 0 0 transparent; /** This is what you want! a image to submit your form and don't  use any javascript, W3C validation and no problems in firefox, Chrome and Internet Explorer! **/
border: none;  /** This is needed to remove image border! **/
color: #080808; /** This is the text color change it to your favorite color **/
} /** The css lines below if you want a hover image sprite or an other hover image, colors etc! **/
   /** use the css below if you would like to have hover changes! **/
input.nothidden:hover {
background-position: 0 -23px; /** example if you're using a sprite image, else use background: url(http://www.hollandiateam.eu/plaatjes/purple_small.gif) no-repeat scroll 0 0 transparent; with the path to your image, if you want to use hover and don't use sprites, you will need to add all css lines used by the input.nothidden class and change image url for hover... **/
color: #0000ff; /** hover text color **/
}

If you use the above code, it will work in all browsers, if you can't get this to work, please post your css and form code and I will edit my answer to fit your needs.

Happy coding

~ Willem

这篇关于图像按钮显示[提交＆QUOT;在Chrome浏览器顶部的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！