Как добавить, что фоновое изображение для входа вводит = “кнопка”?
я пытался изменить фоновое изображение входной кнопки через 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, казалось, не работал.
4 ответа
Вам нужно ввести его без слова image .
background: 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>
Если это кнопка отправки, используйте .
http://www.htmlcodetutorial.com/forms/_INPUT_TYPE_IMAGE.html
Если вы хотите указать изображение с помощью CSS, вам придется использовать type = "submit" .
background-image принимает в качестве значения URL-адрес. Используйте либо
background-image: url ('/image/btn.png');
, либо
background: url ('/image/btn.png') no-repeat;
, что является сокращением для
background-image: url ('/image/btn.png');
background-repeat: no-repeat;
. Кроме того, вы можете посмотреть на кнопку button HTML-элемент для красивых кнопок отправки.
Чтобы добавить к ответам, я думаю, что конкретная причина в этом случае, помимо неуместного no-repeat , - это пробел между url и ( :
background-image: url ('/image/btn.png') no-repeat; /* Won't work */
background-image: url('/image/btn.png'); /* Should work */