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

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

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

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

HTML 4.01 与 HTML 5 之间的差异

HTML5 拥有如下属性：disabled、form、name，HTML 4.01 中不支持这些属性。

属性

属性 值 描述
disabled disabled 规定应该禁用 fieldset。
form form_id 规定 fieldset 所属的一个或多个表单。
name value 规定 fieldset 的名称。

实例：

<!DOCTYPE HTML>

<html>

<body>

<form>

  <fieldset>

    <legend>健康信息</legend>

    身高：<input type="text" />

    体重：<input type="text" />

  </fieldset>

</form>

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

</body>

</html>

效果如下：

HTML <fieldset> 标签将表单内的相关元素分组的更多相关文章

  1. HTML笔记（五）表单<form>及其相关元素

    表单标签<form> 表单是一个包含表单元素的区域. 表单元素是允许用户在表单中输入信息的元素. 输入标签<input> 输入标签的输入类型由其类型属性type决定.常见的输入 ...

  2. 获取表单内的所有元素的值 表单格式化插件jquery.serializeJSON

    简单描述:一个form表单里有十几个input或者select,要获取到他们的值,我的做法一直都是$("#id").val();这样做本来没什么说的,但是如果有很多呢,就很麻烦,看 ...

  3. hTML5实现表单内的上传文件框，上传前预览图片，针刷新预览images

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...

  4. 制作Html标签以及表单、表格内容

    制作Html一般用DW(......),Html全称为(Hyper Text Markup Language   超文本标记语言) 文本就是平常电脑上的文本文档,只能存储文字,而超文本文档可以存储音乐 ...

  5. bootstrap 基础表单 内联表单 横向表单

    bootstrap 基础表单 内联表单 横向表单 <!DOCTYPE html> <html> <head> <title></title> ...

  6. HTML的一些标签以及表单

    HTML的一些标签以及表单 图片标签 属性 说明 src 图像的路径 alt 图像不能显示时的替换文字 title 鼠标悬停时显示的内容 border 设置图像边框的宽度 align 对齐方式 相对路 ...

  7. HTML的表格标签，列表标签，表单标签，HTML5有哪些新特性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  8. HTML5表单内元素的required属性

    当表单内元素(如input.textarea)中有required属性并且值不为false的时候,则该字段不能为空,否则提交失败. <input type="text" au ...

  9. 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明：来源于网络]

    第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...

随机推荐

  1. Nodejs学习笔记（二）——Eclipse中运行调试Nodejs

    前篇<Nodejs学习笔记(一)——初识Nodejs>主要介绍了在搭建node环境过程中遇到的小问题以及搭建Eclipse开发Node环境的前提步骤.本篇主要介绍如何在Eclipse中运行 ...

  2. Clank – 快速构建移动 APP 原型的 HTML/CSS 框架

    Clank 是一个自由和开放源码的 HTML/CSS 框架,可以帮助你轻松创建本地手机或平板电脑应用程序的原型.它着重于提供一致的用户界面,不会刻意去模仿一个特定的 OS .该框架是基于组件的,这样我 ...

  3. 优秀前端开发教程：超炫的 Mobile App 3D 演示

    今天,我们想与您分享一个实验性的3D效果.它涉及到一个3D移动设备和一些移动应用程序截图.点击切换按钮时,我们将让移动设备转动并移动每个画面,使我们能看到一个分层的视图.你可能之前没见过这种应用程序演 ...

  4. isDebugEnabled有什么用？

    这几天在读Spring MVC源码时,发现了如下代码: if (logger.isDebugEnabled()) { logger.debug("Using ThemeResolver [& ...

  5. Java 类库和常用类库

    Java 类库概念: Java 的应用程序接口 (API) 以包的形式来组织,每个包提供了大量的相关类.接口和异常处理类,这些包的集合就是 Java 的类库 包名以 Java 开始的包是 Java 核 ...

  6. Elasticsearch——Search的基本介绍

    Elasticsearch最常用的方法莫过于查询了.Es支持以URI请求参数或者请求体的方式进行查询. 查询范例 Elasticsearch支持对多索引以及多类型进行查询. 比如,下面对某个特定索引的 ...

  7. 主成分分析(PCA)的一种直观理解

    源自知乎的一个答案,网上很多关于PCA的文章,不过很多都只讲到了如何理解方差的投影,却很少有讲到为什么特征向量就是投影方向.本文从形象角度谈一谈,因为没有证明,所以不会严谨,但是应该能够帮助形象理解P ...

  8. 使用elk+redis搭建nginx日志分析平台

    elk+redis 搭建nginx日志分析平台 logstash,elasticsearch,kibana 怎么进行nginx的日志分析呢?首先,架构方面,nginx是有日志文件的,它的每个请求的状态 ...

  9. 关于C# Winform DataGridView 设置DefaultCellStyle无效的原因与解决方案

    上周在开发Winform 项目中,我曾遇到一个看似简单,但一直都没有解决的问题,那就是:设置winform DataGridView控件的行DefaultCellStyle,但却没有任何变化,我也曾求 ...

  10. rtf格式的一些说明，转载的

    RTF是Rich TextFormat的缩写,意即多文本格式.这是一种类似DOC格式(Word文档)的文件,有很好的兼容性,使用Windows"附件"中的"写字板&quo ...