ELLの足跡

人は最後は一人だという…でも、…今は妻が傍にいてくれる…

送信用のボタンに画像を加える方法

WEB上の送信ボタンなど下の図のような文字だけの物が殆んどですよね・・・



これはINPUT要素を使って創られています・・・

例えば、<INPUT type="submit" width="30" value="送信ボタン">のように記述します


しかし、色とかは変えることができますがあくまでも文字だけの事です

アイコンなどを加えることも可能なんでしょうか・・・

実は、BUTTON要素を使用すれば、可能なんです・・・今日はそんなテクニックを紹介しますね・・・


  1. BUTTON要素の使い方は・・・
        <BUTTON>~</BUTTON>の~の部分に記述したまま表示されます

  2. 例えば、GIF画像を使用する場合、HTMLの記述を下のようにします・・・
    <BUTTON type="submit">
    <img src="画像.gif">
    <BR>
    送信します! 
    </BUTTON>


  3. すると、下の様な感じに成ります。


  4. 画像も文字もいくらでも入れることができます。




今日の小技は如何でしたか?