Самый простой вариант создания кнопки, содержащей на себе рисунок - это нарисовать ее в каком-нибудь графическом редакторе. Такие кнопки поддерживаются в форме с помощью параметра input type=image.
Пример 1. Рисованные кнопки| <form> <input type="image" border="0" src="button.gif" width="50" height="20"> </form> |
со ссылками, а при нажатии на кнопку происходит отправка формы на сервер.
Стили позволяют на кнопках, созданных с помощью параметра input type=button или input type=submit, размещать любой фон или рисунок.
Пример 2. Создание фона на кнопке| <form> <input type=button style="background: url(bgbutton.gif); height:20px; line-height:12px;" value="Кнопка с фоном"> </form> |
Параметр url(bgbutton.gif) определяет, какой файл будет использоваться в качестве фона.
Точно таким же образом делается на кнопке и небольшой рисунок. Подготавливается изображение, которое будет использоваться в качестве фона, а на нем размещаете любую иконку.
- Рисунок для фона
| <form> <input type=button style="background: url(imgbutton.gif) no-repeat left; height:20px; line-height:12px;" value=" Кнопка с рисунком"> </form> |
url(imgbutton.gif) указывает пукть к рисунку, no-repeat left означает, что фон не повторяется и выровнен по левому краю.
пробелов.
| |||||||||||||||||||