HTML5的fieldset标签
定义和用法
fieldset 元素可将表单内的相关元素分组，绘制一个带标题的框，有如winform开发中的panel。
<fieldset> 标签将表单内容的一部分打包，生成一组相关表单的字段。<fieldset> 标签没有必需的或唯一的属性。
当一组表单元素放到 <fieldset> 标签内时，浏览器会以特殊方式来显示它们，它们可能有特殊的边界、3D 效果，或者甚至可创建一个子表单来处理这些元素。
HTML 4.01 与 HTML 5 之间的差异
在 HTML 5 中有一些新属性，同时不再支持 HTML 4.01 中的一些属性。
属性
| 属性 | 值 | 描述 | HTML4 | HTML5 |
|---|---|---|---|---|
| disabled | true | false | 定义 fieldset 是否可见。 | × | √ |
| form | true | false | 定义该 fieldset 所属的一个或多个表单。 | × | √ |
标准属性
class, contenteditable, contextmenu, dir, draggable, id, irrelevant,lang, ref, registrationmark, tabindex, template, title
事件属性
onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu,ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover,ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress, onkeyup,onload, onmessage, onmousedown, onmousemove, onmouseover, onmouseout,onmouseup, onmousewheel, onresize, onscroll, onselect, onsubmit, onunload
本例演示如何在数据周围绘制一个带标题的框。
<html>
<body>
<fieldset>
<legend>健康信息：</legend>
<form>
<label>身高：<input type="text" /></label>
<label>体重：<input type="text" /></label>
</form>
</fieldset>
<p>如果表单周围没有边框，说明您的浏览器太老了。</p>
</body>
</html>
演示效果
测试在IE8，Firefox，Opera，Safari，Chrome中有效
参考：http://www.devdo.net/html5-fieldset.html
HTML5的fieldset标签的更多相关文章
- HTML5<fieldset>标签
1.<fieldset>标签对表单中的相关元素进行分组. 2.<fieldset>标签会在相关表单元素周围绘制边框. <!DOCTYPE html><html ...
- html5语义化标签使用规范
Html5添加了很多语义化标签,一个典型的html5页面结构可以如下安排 一.使用案例 1. 头部——header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍 ...
- HTML <fieldset> 标签将表单内的相关元素分组
<fieldset> 标签将表单内容的一部分打包,生成一组相关表单的字段. 当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边 ...
- 测试开发之前端——No2.HTML5中的标签
HTML5中的标签. 标签 描述 <!--...--> 定义注释. <!DOCTYPE> 定义文档类型. <a> 定义超链接. <abbr> 定义缩写 ...
- 来吧，HTML5之基础标签(下)
<dialog> 标签 定义对话框或窗口. <dialog> 标签是 HTML 5 的新标签.目前只有 Chrome 和 Safari 6 支持 <dialog> ...
- HTML5 Audio/Video 标签,属性,方法,事件汇总
HTML5 Audio/Video 标签,属性,方法,事件汇总 (转) 2011-06-28 13:16:48 <audio> 标签属性:src:音乐的URLpreload:预加载au ...
- HTML5部分新标签属性及DOM扩展元素
HTML5定义了一系列新元素,如新语义标签.智能表单.多媒体标签等. 我们日常讨论的H5其实是一个泛称,它指的是由HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台. ...
- [转] 移动前端不得不了解的HTML5 head 头标签
HTML的头部内容特别多,有针对SEO的头部信息,也有针对移动设备的头部信息.而且各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元 素,有很多差异性.移动端的工作已经越来越成为前端工作的重要内容 ...
- HTML语义化：HTML5的新标签及IE5.5~9的部分兼容方案
一.前言 本文将介绍HTML5中新增的语义化标签,及在IE5.5~9(IE9已经开始支持部分HTML5新标签了)支持这些新标签的兼容性处理. 目录一坨: 二.语义化标签:article.aside.t ...
随机推荐
- objective-c自学总结（一）---面向对象
本人大二本科在读,利用一个月多一点的时间对OC语言基础进行了自学,在下一阶段UI学习开始之前, 对这一阶段的自学进行一些总结.在此特别感谢刘晓斌学长和无线互联3G学院 首先说一下对OC的整体感觉,这是 ...
- github -- fork提交项目
我们在进行Github协同开发的时候,往往会去fork一个仓库到自己的Github中,过一段时间以后,原仓库可能会有各种提交以及修改,很可惜,Github本身并没有自动进行同步的机制,这个需要我们手动 ...
- 搭建SpringMVC+MyBatis开发框架一
大部分 Java 应用都是 Web 应用,展现层是 Web 应用不可忽略的重要环节.Spring 为展现层提供了一个优秀的 Web 框架—— Spring MVC.和众多其他 Web 框架一样,它基于 ...
- 网件无线网卡在windows 2012支持问题
网件的无线网卡的驱动是支持windows 8.1的,但是安装了驱动后,却没法启动网卡.网上搜索后发现,service里面网件有一进程没法启动:而2012年忘记官方论坛技术支持答复咨询居然说,网件驱动不 ...
- Xamarin.Android之转换，呼叫，查看历史纪录
Xamarin.Android之转换,呼叫,查看历史纪录 E文文章. 功能:能将输入的字母转换成相应的数字.并且能呼叫出去.能查看呼叫的历史纪录. 界面代码如下: <?xml version=& ...
- 【Search for a Range】cpp
题目: Given a sorted array of integers, find the starting and ending position of a given target value. ...
- NYOJ-102 次方求模 AC 分类： NYOJ 2014-02-06 18:53 184人阅读 评论(0) 收藏
地址:http://acm.nyist.net/JudgeOnline/problem.php?pid=102 //a^b mod c=(a mod c)^b mod c很容易设计出一个基于二分的递归 ...
- 在linux中使用phpize安装php扩展模块
介绍:linux系统中,php安装成功后,在bin目录下会生成一个名叫phpize的可执行脚本,这个脚本的用途是动态安装php扩展模块.使用phpize脚本安装php扩展模块的好处:在安装php时没有 ...
- 引擎设计跟踪(九.14.2b) 骨骼动画基本完成
首先贴一个介绍max的sdk和骨骼动画的文章, 虽然很早的文章, 但是很有用, 感谢前辈们的贡献: 3Ds MAX骨骼动画导出插件编写 1.Dual Quaternion 关于Dual Quatern ...
- display:inline-block引发的间隙问题解决办法
在网页布局中我们经常会用到display:inline-block;好处是:能够将块状元素按照内联元素的方式布局,同时能设置宽高.个人感觉很好用,可是用多了慢慢的问题就来了? 1.display:in ...