我一直在尝试通过css更改输入按钮的背景图片，但它不起作用。
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:
.button {
background-image: url ('/image/btn.png') no-repeat;
cursor:pointer;
}
有什么问题吗？
即使内联 css 似乎也不起作用。
你需要输入没有
imagebackground: url('/image/btn.png') no-repeat;测试了两种方式，这个有效。
例子：
<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>
只是补充一下答案，我认为这种情况下的具体原因，除了错位
no-repeaturl(background-image: url ('/image/btn.png') no-repeat; /* Won't work */
background-image: url('/image/btn.png'); /* Should work */
如果这是提交按钮，请使用
<input type="image" src="..." ... />http://www.htmlcodetutorial.com/forms/_INPUT_TYPE_IMAGE.html
如果你想用CSS指定图像，你必须使用
type="submit".button{
background-image:url('/image/btn.png');
background-repeat:no-repeat;
}
.button-class {
background: url(images/tom1.png) no-repeat; /* local source or link */
cursor: pointer; /* if you want different cursor */
border: none;
}
or
#button-id {
background: url(images/img.png) no-repeat;
cursor: pointer;
border: none;
}