HTML <legend> 标签
在html中,<legend>标签通常和<fieldset>标签一起使用来将表单内的相关元素分组,<legend>标签的作用是为fieldset元素定义标题。
实例
组合表单中的相关元素:
<!DOCTYPE HTML>
<html>
<body>
<form action="/example/html/html_page.aspx">
<fieldset>
<legend>健康信息</legend>
身高:<input type="text">
体重:<input type="text">
<input type="submit" value="提交">
</fieldset>
</form>
<p>如果表单周围没有边框,说明您的浏览器太老了。</p>
</body>
</html>
浏览器支持
元素 | |||||
---|---|---|---|---|---|
<legend> | Yes | Yes | Yes | Yes | Yes |
所有浏览器都支持 <legend> 标签。
定义和用法
legend 元素为 fieldset 元素定义标题(caption)。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中,align 属性不建议使用。在 XHTML 1.0 Strict DTD 中,不支持 align 属性。
可选的属性
DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.
属性 | 值 | 描述 | DTD |
---|---|---|---|
align |
| 不建议使用。请使用样式代替。 为 fieldset 中的标题定义对齐方式。 | TF |
全局属性
<fieldset> 标签支持 HTML 中的 全局属性。
事件属性
<fieldset> 标签支持 HTML 中的 事件属性。
更多实例
带有更多样式的 legend 例子
<html>
<head>
<style>
fieldset {
background-color: #eeeeee;
}
legend {
background-color: gray;
color: white;
padding: 5px 10px;
}
input {
margin: 5px;
}
</style>
</head>
<body>
<form action="/example/html/html_page.aspx">
<fieldset>
<legend>健康信息</legend>
身高:<input type="text">
体重:<input type="text">
<input type="submit" value="提交">
</fieldset>
</form>
</body>
</html>
legend 标签默认样式
legend {
display: block;
padding-left: 2px;
padding-right: 2px;
border: none;
}