如何为输入类型=“按钮"添加背景图像? [英] How to add background image for input type="button"?
本文介绍了如何为输入类型=“按钮"添加背景图像?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我一直在尝试通过 css 更改输入按钮的背景图像,但它不起作用.
i've been trying to change the background image of the input button through css, but it doesn't work.
search.html:
search.html:
<body>
<form name="myform" class="wrapper">
<input type="text" name="q" onkeyup="showUser()" />
<input type="button" name="button" value="Search" onclick="showUser()" class="button"/>
<p>
<div id="txtHint"></div>
</p>
</form>
</body>
search.css:
search.css:
.button {
background-image: url ('/image/btn.png') no-repeat;
cursor:pointer;
}
可能有什么问题?
甚至内联 css 似乎也不起作用.
even inline-ing the css didn't seem to work.
推荐答案
你需要输入不带image
这个词.
You need to type it without the word image
.
background: url('/image/btn.png') no-repeat;
两种方式都测试过,这种方式有效.
Tested both ways and this one works.
示例:
<html>
<head>
<style type="text/css">
.button{
background: url(/image/btn.png) no-repeat;
cursor:pointer;
border: none;
}
</style>
</head>
<body>
<input type="button" name="button" value="Search" onclick="showUser()" class="button"/>
<input type="image" name="button" value="Search" onclick="showUser()" class="button"/>
<input type="submit" name="button" value="Search" onclick="showUser()" class="button"/>
</body>
</html>
这篇关于如何为输入类型=“按钮"添加背景图像?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文