ホームページ作成ガイド

入力部分の色を変える

<html><head><title>入力部分の色を変えるる</title>
</head>
<body>
<form>
名前：<input type="text" name="name" value="" size="30" onFocus="this.style.backgroundColor='#ccccff'" onBlur="this.style.backgroundColor='#ffffff'">
メールアドレス：<input type="text" name="mail" value="" size="30" onFocus="this.style.backgroundColor='#ccccff'" onBlur="this.style.backgroundColor='#ffffff'">
感想：<textarea name="comment" rows="5" cols="50" onFocus="this.style.backgroundColor='#ccccff'" onBlur="this.style.backgroundColor='#ffffff'"></textarea>
<input type="submit" value="　送　信　">
</form>
</body>
</html>

カーソルを置いた入力フォームの色が変わります。
どの部分を入力しているのかわかりやすくなります。

onFocus="this.style.backgroundColor='#ccccff'"
で、カーソルが置かれたときのフォームの色を指定します。

onBlur="this.style.backgroundColor='#ffffff'"
で、カーソルが離れたときのフォームの色を指定します。