fieldset

定义和用法

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

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

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

所有浏览器都支持 <fieldset> 标签。

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

HTML 4.01 与 HTML 5 之间的差异

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

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

legend

定义和用法

legend 元素为 fieldset 元素定义标题

所有浏览器都支持 <legend> 标签。

HTML 与 XHTML 之间的差异

在 HTML 4.01 中,align 属性不被赞成使用。

在 XHTML 1.0 Strict DTD 中,align 属性不被支持。

可选的属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性 描述 DTD
align
  • top
  • bottom
  • left
  • right

不赞成使用。请使用样式代替。

为 fieldset 中的标题定义对齐方式。

TF

display

所有主流浏览器都支持 display 属性。

定义和用法

display 属性规定元素应该生成的框的类型。

说明

这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等文档类型,如果使用 display 不谨慎会很危险,因为可能违反 HTML 中已经定义的显示层次结构。对于 XML,由于 XML 没有内置的这种层次结构,所有 display 是绝对必要的。

注释:CSS2 中有值 compact 和 marker,不过由于缺乏广泛的支持,已经从 CSS2.1 中去除了。

默认值: inline
继承性: no
版本: CSS1
JavaScript 语法: object.style.display="inline"

可能的值

描述
none 此元素不会被显示。
block 此元素将显示为块级元素,此元素前后会带有换行符
inline 默认。此元素会被显示为内联元素,元素前后没有换行符。
inline-block 行内块元素。(CSS2.1 新增的值)
list-item 此元素会作为列表显示。
run-in 此元素会根据上下文作为块级元素或内联元素显示。
compact CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。
marker CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。
table 此元素会作为块级表格来显示(类似 <table>),表格前后带有换行符。
inline-table 此元素会作为内联表格来显示(类似 <table>),表格前后没有换行符。
table-row-group 此元素会作为一个或多个行的分组来显示(类似 <tbody>)。
table-header-group 此元素会作为一个或多个行的分组来显示(类似 <thead>)。
table-footer-group 此元素会作为一个或多个行的分组来显示(类似 <tfoot>)。
table-row 此元素会作为一个表格行显示(类似 <tr>)。
table-column-group 此元素会作为一个或多个列的分组来显示(类似 <colgroup>)。
table-column 此元素会作为一个单元格列显示(类似 <col>)
table-cell 此元素会作为一个表格单元格显示(类似 <td> 和 <th>)
table-caption 此元素会作为一个表格标题显示(类似 <caption>)
inherit 规定应该从父元素继承 display 属性的值。

fieldset、legend、display html元素的更多相关文章

  1. html5中的fieldset/legend元素和keygen元素

    html5中的fieldset/legend元素和keygen元素 一.总结 一句话总结: fieldset/legend元素和figure和figcaption很像,只不过是作用于表单,前者表示内容 ...

  2. html5,新增的元素,fieldset legend

    <form action="">    <fieldset>        <legend>用户注册</legend>       ...

  3. html系列教程--embed fieldset legend figure figurecaption

    <embed> 标签:定义嵌入的内容 <embed src="" type="" /> embed属性: 1.src:嵌入内容地址 2. ...

  4. html5-fieldset和legend和keygen元素的用法

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  5. HTML 表单和输入<textarea><label><fieldset><legend><select><optgroup><option><button>

    textarea><label><fieldset><legend><select><optgroup><option>& ...

  6. 去掉display:inline-block元素间的多余空白

    问题:每1个带display:inline-block;属性的链接 a 水平.垂直方向都带有一定的空白 关键在于父元素定义font-size:0 去掉行内块元素水平方向空白:子元素定义vertical ...

  7. display:inline-block元素间空白间隙问题

    display:inline-block元素间有空白间隙,可以在父元素上加font-size:0

  8. 清除display:inline-block元素换行符间隙font-size:0;

    font-size:0; 清除display:inline-block元素换行符间隙 看例子: css: .dd {background-color: #ddd;} .dd2 {background- ...

  9. jquery控制css的display(控制元素的显示与隐藏)

    使用jquery控制div的显示与隐藏: $("#div的id").show()表示display:block, $("#div的id").hide()表示di ...

随机推荐

  1. CentOS运行C++语言的Hello World

    1,编写代码,hello.cpp #include <iostream> using namespace std; int main(){ cout<<"hello ...

  2. 喝最烈的酒、挖最大的DONG——工具与技巧篇

    本文作者:i春秋签约作家——黑色镰刀 0×00 前言 在这个科技发达的时代,很多时候工具都可以代替人做很多事情,之前我就有谈起过有企业将人工智能运用于网络安全方面,像如今,也有更多更人性化更智能的工具 ...

  3. [javascript]——移动端 HTML5 图片上传预览和压缩

    在开发移动端web网页中,我们不可避免的会遇到文件上传的功能,但由于手机图片尺寸太大,上传时间过长导致用户体验太差,就需要在上传前对图片进行一定的压缩. 在代码之前,有必要先了解我们即将使用到的几个A ...

  4. leetcode-268-Missing Number(异或)

    题目描述: Given an array containing n distinct numbers taken from 0, 1, 2, ..., n, find the one that is ...

  5. 2016级算法期末上机-C.简单·Bamboo's Fight with DDLs III

    简单·Bamboo's Fight with DDLs III 分析 一句话:贪心,简单哈夫曼应用,要求的其实是所有结点的值与权值的乘积之和,也就是带权路径长. 可以理解为非叶子节点的权值的和,这里的 ...

  6. C++类的构造函数及定义

    定义一个普通的类时,一定要定义它自己的构造函数.原因有三:第一个原因是编译器只有在发现类不包含任何构造函数的情况下才会替我们生成一个默认的构造函数,一旦我们定义了一些其他的构造函数,那么除非我们再定义 ...

  7. 牛客OI周赛8-提高组A-用水填坑

    牛客OI周赛8-提高组A-用水填坑 题目 链接: https://ac.nowcoder.com/acm/contest/403/A 来源:牛客网 时间限制:C/C++ 2秒,其他语言4秒 空间限制: ...

  8. [Xamarin.iOS] 如何引用Objective-c寫的Class Library (转帖)

    這個範例是如何在Xamarin.ios中去使用一個我們自行在Xcode中開發的Objective-c Class Library. 主要會執行的步驟如下 1. 在Xcode 裡面去建立一個Class ...

  9. PHPStorm操作小技巧

    1.围绕选中字符输入引号或者括号 2.设置服务器部署 3.隐藏Project快捷键 Shift + Esc 4.IDE内窗口切换 Ctrl + TAB 5.关闭当前项目 File -> Clos ...

  10. hibernate基本配置show_sql、sql_format

    show_sql是否打印生成的sql语句: <property name="show_sql">false</property> sql_format,格式 ...