無味乾燥な送信ボタンの代わりにイメージを貼り付けたらカッコいいだろう・・・ と思っていたら、簡単なHTMLで可能だった！！
<input type="image" src="イメージファイルのURL" alt="テキスト名称" name="ボタンの名称">と記述するだけ。これらの属性のほかには、align、width、height、borderなんかも指定できそう（すべては試してないけど）。詳しくはここを参照のこと。
こんな書き方、今日はじめて知った。HTMLも奥が深いねぇ。
Archive for category HTML
送信ボタンにイメージをつける
3月 25
Formの改行に悩む
9月 24
Webページでformを扱っていると、</form>の後に改行がついてしまうのにいつもてこずってしまう。特に複数のformの複数のsubmitボタンを並べたいときに苦労する。
例えば、
<form>こんな感じでてきとーに書いてしまうと、
<input type="submit">
</form>
<form>
<input type="submit">
</form>
<form>
<input type="submit">
</form>
［ボタン］
［ボタン］
［ボタン］
って感じになってしまう。これをなんとか
［ボタン］［ボタン］［ボタン］
にしたいわけだ。
大まかに、対策としては２つあって、１つはスタイルシートで対処する方法。
<form style="margin: 0px; float: left;">といった感じにする。これだとＰＣのブラウザで見る限りはうまく
<input type="submit">
</form>
<form style="margin: 0px; float: left;">
<input type="submit">
</form>
<form style="margin: 0px; float: left;">
<input type="submit">
</form>
［ボタン］［ボタン］［ボタン］
になっているはず。ところが、ケータイ（i-mode）ではまだ縦に並んでいる・・・
根本的に対処するにはコードを変える必要があって、これがもう一つの対処法だけど、
<form>のように一つのformにまとめてしまう方法。これだと苦も無くボタンは横並び
<input type="submit" name="hoge1" value="hoge1">
<input type="submit" name="hoge2" value="hoge2">
<input type="submit" name="hoge3" value="hoge3">
</form>
［ボタン］［ボタン］［ボタン］
になるし、ケータイで見ても横に並んでいる。ただ、この方法だとformが一つだからsubmitの送り先が一つになってしまう。よって、送り先スクリプトで処理を分岐しないといけないし、重い処理が複数あるときは送り先が大混乱してしまうかもしれない。
と言っても、なるべく後者の方法で頑張るのが一番素直な対処法なんだろうな。