ボタン類を大きくする
<html><head><title>ボタン類を大きくする</title></head>
<body>
<form>
名前 <input type="text" name="name" style="font-size:150%"><br>
性別 <input type="radio" name="sex" value="man" style="width:30px; height:30px">男性
<input type="radio" name="sex" value="female" style="width:30px; height:30px">女性<br>
生まれた年<select name="select" style="font-size:150%">
<option>選択してください</option>
<option>60年代</option>
<option>70年代</option>
<option>80年代</option>
<option>90年代</option>
</select>
好きな食べ物<br>
<input type="checkbox" name="checkbox" value="apple" style="width:30px; height:30px">りんご
<input type="checkbox" name="checkbox" value="orange" style="width:30px; height:30px">みかん
<input type="checkbox" name="checkbox" value="strawberry" style="width:30px; height:30px">いちご<br>
<br>
感想<br>
<textarea rows="6" cols="40" wrap="soft" name="comment" style="font-size:150%"></textarea><br>
<br>
<input type="submit" name="sbmt" value="送信" style="font-size:150%; width:60px; height:50px">
</form>
</body></html>
テキストボックスやボタンなど、フォームに関連するアイテムを大きくする小ワザです。
パソコン操作に慣れてない方や得意でない方を対象としたページにオススメです。
▼テキストボックスを大きくする
<input type="text" name="name" style="font-size:150%">
style="font-size:150%"を入れる。
▼ラジオボタンを大きくする
<input type="radio" name="sex" value="man" style="width:30px; height:30px">
style="width:30px; height:30px"を入れる。
※Macでは大きくなりません。
▼プルダウンメニューを大きくする
<select name="select" style="font-size:150%">
style="font-size:150%"を入れる。
▼チェックボックスを大きくする
<input type="checkbox" name="checkbox" value="apple" style="width:30px; height:30px">
style="width:30px; height:30px"を入れる。
※Macでは大きくなりません。
▼テキストエリアを大きくする
<textarea rows="6" cols="40" wrap="soft" name="comment" style="font-size:150%">
style="font-size:150%"を入れる。
▼ボタンを大きくする
<input type="submit" name="sbmt" value="送信" style="font-size:150%; width:60px; height:50px">
style="font-size:150%; width:60px; height:50px"を入れる。
※Macでは文字（ここでは「送信」）がボタン上部に配置されます。
ホームページ作成ガイド
ホームページ作成ガイド