как установить фоновое изображение в кнопку отправки?

Question

как установить фоновое изображение в кнопке отправки?

Мне нужно использовать изображение вместо обычной кнопки отправки? какой путь будет лучшим в xhtml / css?

Кнопка должна выглядеть одинаково во всех основных браузерах, включая IE6, IE7

Answer 1

Я обычно делаю это следующим образом:

div#submitForm input {
  background: url("../images/buttonbg.png") no-repeat scroll 0 0 transparent;
  color: #000000;
  cursor: pointer;
  font-weight: bold;
  height: 20px;
  padding-bottom: 2px;
  width: 75px;
}

и разметка:

<div id="submitForm">
    <input type="submit" value="Submit" name="submit">
</div>

Если в разных браузерах все выглядит по-разному, я умоляю вас использовать таблицу стилей сброса, которая устанавливает все поля, отступы и, возможно, даже границы на ноль.

Answer 2

.button {
    border: none;
    background: url('/forms/up.png') no-repeat top left;
    padding: 2px 8px;
}

Answer 3

Как правило, можно использовать один (или несколько) тегов изображения, возможно, в сочетании с установкой фоновых изображений div в css, которые будут действовать как кнопка отправки. Фактическая отправка будет сделана в javascript для события click.

A учебник по предмету.

Answer 4

я делаю так кнопка обложки и среднее изображение,

<button><img src="foldername/imagename" width="30px" height= "30px"></button>

Answer 5

Вы можете попробовать следующий код:

background-image:url('url of your image') 10px 10px no-repeat