| Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 4.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
Завдання
Зробити графічну кнопку у формі, клацання по якій відбувається відправка форми.
Рішення
Відправка форми відбувається не тільки при натисненні на кнопку <input type="submit">, але і при натисканні на малюнок, доданий через тег <input type="image">. Обов'язковим атрибутом тега <input> при такому значенні type виступає src, який вказує шлях до графічного файлу (приклад 1).
Приклад 1. Малюнок для відправки форми
HTML5CSS 2.1IECrOpSaFx
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Голосування</title>
<style>
body {
background: #fff38f; /* Колір фону веб-сторінки */
color: #f66e00; /* Колір тексту */
}
</style>
</head>
<body>
<div class="vote">
<form action="" method="post">
<p><strong>Чи потрібно проводити чемпіонат по Counter Strike?</strong></p>
<p><input type="radio" name="cs" value="Так"> Так</p>
<p><input type="radio" name="cs" value="Ні"> Ні</p>
<p><input type="image" src="images/okbutton.png" alt="ОК"></p>
</form>
</div>
</body>
</html>
Результат цього прикладу показано на рис. 1. В даному контексті малюнок є кнопкою, при натисканні на яку відбувається відправка форми за адресою, заданому атрибутом action тега <form>.
Рис. 1. Кнопка для відправки форми