今回は送信ボタンを作ります。
送信ボタン
では、さっそっく書きましょう。
<form action="example.php" method="post" name="contact_form">
<input type="submit" value="送信する">
</form>「value」の属性値が、ボタンの上に表示されるテキストになります。
表示は次の通りです。
これで、ユーザーがフォームに入力した内容を送信できるようになりました。
送信内容を受け取るには、PHPなどのサーバーサイド言語が必要になってきます。今後学んでいきましょう。
続いて、「送信する」ボタンのデザインがなんとも味気ないと感じた人のために、ボタンを画像にする方法を紹介します。
まずはボタンにする画像を用意します。
今回のレクチャー用に画像を作りましたので。それを使ってみるか、ご自分で用意してください。
レクチャー用の画像
画像が用意できたら、「html_css」フォルダの「image」フォルダの中に格納してください。
準備ができましたらコードを書きましょう。
書き方は次の通りです。
<form action="example.php" method="post" name="contact_form">
<input type="image" src="../image/send.png" alt="送信する">
</form>結果を見てみましょう。次のようになります。
これで、画像を送信ボタンにできるようになりました。
今回のレクチャーは以上です。
お疲れさまでした。
