野暮用で似たようなことをしようとしたんだけど、html5で試してみる。
htmlページはこんな感じ。
<!doctype html>
<html>
<!-- header -->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<!-- body -->
<body>
<!-- input -->
<fieldset>
<legend>answer</legend>
<p><label><input type="radio" name="answer" value="yes" checked />Yes</label></p>
<p><label><input type="radio" name="answer" value="no" />No</label></p>
</fieldset>
</body>
</html>
<!doctype html>
<html>
<!-- header -->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<!-- body -->
<body>
<!-- input -->
<fieldset>
<legend>answer</legend>
<p><label><input type="radio" name="answer" value="yes" checked />Yes</label></p>
<p><label><input type="radio" name="answer" value="no" />No</label></p>
</fieldset>
</body>
</html>
<!doctype html>
<html>
<!-- header -->
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
</head>
<!-- body -->
<body>
<!-- input -->
<fieldset>
<legend>answer</legend>
<p><label><input type="radio" name="answer" value="yes" checked />Yes</label></p>
<p><label><input type="radio" name="answer" value="no" />No</label></p>
</fieldset>
</body>
</html>
やるこた、こんな感じ。
- <fieldset>の子要素として<input>を定義する
- タイトルを付けたい場合は<fieldset>の子要素に<legend>を定義する
Firefoxで確認。
Windowsとかの設定ダイアログあたりでありそうな、見出しと囲いが表示される。
ちなみに、<fieldset>のdisabledって属性値をdisableって設定すれば、<fieldset>の子要素はまとめて非活性にできちゃう。
こんな感じで書く。
<fieldset disabled="disable">
<fieldset disabled="disable">
<fieldset disabled="disable">
と、こんな感じになる。
ま、メモってことで。