`
lij2960
  • 浏览: 17616 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

HTML <fieldset> 标签使用方法

    博客分类:
  • html
 
阅读更多

这个标签很少用到,不过实际运用中可以得到意想不到的效果,如:


定义和用法

fieldset 元素可将表单内的相关元素分组。

<fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段。

当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边界、3D 效果,或者甚至可创建一个子表单来处理这些元素。

<fieldset> 标签没有必需的或唯一的属性。

<legend> 标签为 fieldset 元素定义标题。

实例:

 

<!DOCTYPE HTML>
<html>

<body>

<form>
  <fieldset>
    <legend>健康信息</legend>
    身高:<input type="text" />
    体重:<input type="text" />
  </fieldset>
</form>

<p>如果表单周围没有边框,说明您的浏览器太老了。</p>

</body>
</html>

 实例效果:

分享到:
评论

相关推荐

    fieldset标签定义说明.docx

    `&lt;fieldset&gt;`标签用于定义一个字段集,通常与`&lt;legend&gt;`标签配合使用,`&lt;legend&gt;`为字段集提供了一个标题或说明,帮助用户理解字段集的目的。例如: ```html &lt;fieldset&gt; &lt;legend&gt;Personalia:&lt;/legend&gt; &lt;label&gt;...

    HTML常用标签.pdf

    13. &lt;h1&gt; -- &lt;h6&gt;:&lt;h1&gt; - &lt;h6&gt; 标签可定义标题。&lt;h1&gt; 定义最大的标题。&lt;h6&gt; 定义最小的标题。 14. &lt;hr&gt;:&lt;hr&gt; 标签在 HTML 页面中创建一条水平线。 15. &lt;center&gt;:对其所包括的文本进行水平居中。 16. &lt;a&gt;:&lt;a&gt; ...

    fieldset相关的总结

    这篇博客文章“fieldset相关的总结”可能详细介绍了`&lt;fieldset&gt;`的使用方法、作用以及在实际项目中的应用。尽管没有具体的描述内容,但我们可以从标签“源码”和“工具”推测,博主可能深入探讨了`&lt;fieldset&gt;`的HTML...

    jquery fieldset和legend标签代码.zip

    在网页设计中,`&lt;fieldset&gt;` 和 `&lt;legend&gt;` 标签是HTML中用于组织表单元素的重要工具。它们提供了一种方法,可以帮助用户更清晰地理解表单的目的和结构。`&lt;fieldset&gt;` 可以看作是表单的一个区域,可以包含多个相关的...

    HTML标签英文单词

    根据提供的文件信息,我们可以深入探讨一系列HTML标签及其用途。HTML(HyperText Markup Language)是一种用于创建网页的标准标记语言。...理解和熟练掌握这些标签的使用方法,对于开发高质量的Web应用程序至关重要。

    html标签介绍大全

    本篇文章将深入探讨HTML标签的全貌,旨在帮助读者全面了解并掌握这些标签的使用方法。 一、HTML基本结构 每个HTML文档都由&lt;!DOCTYPE&gt;声明开始,它告诉浏览器文档遵循的HTML版本。接着是&lt;html&gt;标签,它是整个文档的...

    头歌教学实践平台 Web前端开发基础 HTML-表单类的标签

    7. `&lt;fieldset&gt;`和`&lt;legend&gt;`标签:用于组织表单,`&lt;fieldset&gt;`定义一个区域,`&lt;legend&gt;`为该区域添加标题。 示例: ```html &lt;fieldset&gt; &lt;legend&gt;个人信息&lt;/legend&gt; &lt;!-- 表单元素 --&gt; &lt;/fieldset&gt; ``` 8. ...

    呕心沥血版HTML标记实例

    例如,使用&lt;script&gt;标签引入JS代码,&lt;button&gt;配合onclick事件处理函数,或者利用DOM操作改变HTML内容。 十、CHM文件介绍 CHM是Microsoft的 Compiled HTML Help 文件,是一种常见的帮助文档格式,将HTML页面、索引...

    HTML标签解释大全

    - **说明**:`&lt;acronym&gt;` 标签用于标明缩写词,但这个标签已经被废弃,在HTML5中不再推荐使用。例如: ```html &lt;acronym title="World Health Organization"&gt;WHO&lt;/acronym&gt; ``` ##### 标签:address - **说明**...

    前端基础总结

    在HTML中,表单是用于收集用户输入的一种机制,常见的表单标签包括&lt;form&gt;、&lt;input&gt;、&lt;label&gt;、&lt;textarea&gt;、&lt;fieldset&gt;、&lt;select&gt;、&lt;option&gt;、&lt;optgroup&gt;等。表单元素通常需要包含name属性,这样提交表单时数据才能被...

    按功能顺序列出的 HTML 4.01/XHTML 1.0 标签手册

    表单相关标签如 `&lt;form&gt;`、`&lt;input&gt;`、`&lt;textarea&gt;`、`&lt;button&gt;`、`&lt;select&gt;`、`&lt;optgroup&gt;`、`&lt;option&gt;`、`&lt;label&gt;`、`&lt;fieldset&gt;` 和 `&lt;legend&gt;` 用于创建用户交互的表单,收集和提交数据。 列表标签包括 `&lt;ul&gt;`...

    HTML常见标签

    - `&lt;label&gt;`定义标签,与`&lt;input&gt;`配合使用,增强可访问性。 - `&lt;button&gt;`定义按钮,`&lt;fieldset&gt;`和`&lt;legend&gt;`组织相关表单元素。 8. HTML5新增标签: - `&lt;header&gt;`、`&lt;footer&gt;`、`&lt;nav&gt;`、`&lt;section&gt;`、`...

    HTML标签帮助文档

    HTML表单由`&lt;form&gt;`标签开启,包括各种输入元素如`&lt;input&gt;`(文本、密码、复选框、单选按钮等)、`&lt;textarea&gt;`(多行文本输入)、`&lt;select&gt;`(下拉列表)、`&lt;option&gt;`(下拉选项)和`&lt;button&gt;`(按钮)等,以及`...

    html知识

    `&lt;legend&gt;` 标签用于为 `&lt;fieldset&gt;` 提供标题。它常用于表单中的分组标题,以便清晰地区分不同的表单字段。 **示例代码:** ```html &lt;fieldset&gt; &lt;legend&gt;个人信息&lt;/legend&gt; &lt;label for="fname"&gt;名字:&lt;/label&gt; ...

    html5标签大全

    本文将对 HTML5 中的所有标签进行分类和解释,帮助开发者快速了解和使用这些标签。 结构性标签 * `&lt;header&gt;`:定义 section 或 page 的页眉 * `&lt;footer&gt;`:定义 section 或 page 的页脚 * `&lt;nav&gt;`:定义导航链接 *...

    html5标签整理

    - `&lt;legend&gt;`:定义`&lt;fieldset&gt;`的标题。 **4. 框架** - `&lt;iframe&gt;`:定义内联框架。 - `&lt;frameset&gt;`:定义框架集。 - `&lt;frame&gt;`:定义框架集的窗口或框架。 **5. 图像** - `&lt;img&gt;`:定义图像。 - `&lt;figure&gt;`:...

Global site tag (gtag.js) - Google Analytics