（13）html表单<form>之二使用〈fieldset〉和〈legend〉结构化表单

最新推荐文章于 2024-04-16 15:15:08 发布

mxd_xyz

最新推荐文章于 2024-04-16 15:15:08 发布

阅读量1.5k

点赞数

分类专栏： html学习笔记

本文链接：https://blog.csdn.net/mxd395/article/details/24001669

版权

html学习笔记专栏收录该内容

17 篇文章 0 订阅

订阅专栏

在html表单<form>之一中，可以看得，为了规范表单格式，所有的表单控件都被定义在了table表格之中。这一节，我们使用<fieldset>在一组控件周围建立边框，表明这些控件是相关的并用<legend>为由<fieldset>元素圈起的一组控件添加标题。（<legend>必须是<fieldset>的一个子元素）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
	<head>
		<meta charset="utf-8" />  
		<base href="/testsmarty/templates/"></base>
		<title>fieldset与legend学习</title>
	</head>
	
	<body>
		<form method="post">
			<fieldset>
				<legend><b>第一题</b></legend>
				<p>html是什么意思?</p>
				<ul>
					<li><input type="radio" name="radio_1" value="1" checked="checked" />超文本标记语言</li>
					<li><input type="radio" name="radio_1" value="2" />高级文本语言</li>
					<li><input type="radio" name="radio_1" value="3" />扩展标记语言</li>
				</ul>
			</fieldset>
			<fieldset>
				<legend><b>第二题</b></legend>
				<p>html是什么意思?</p>
				<ul>
					<li><input type="radio" name="radio_2" value="1" checked="checked" />超文本标记语言</li>
					<li><input type="radio" name="radio_2" value="2" />高级文本语言</li>
					<li><input type="radio" name="radio_2" value="3"/>扩展标记语言</li>
				</ul>
			</fieldset>
		</form>
	</body>
</html>

效果图如下：