国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

directory search
Attributes accesskey (attribute) class (attribute) contenteditable (attribute) contextmenu (attribute) data-* (attribute) dir (attribute) draggable (attribute) dropzone (attribute) Global attributes hidden (attribute) id (attribute) itemid (attribute) itemprop (attribute) itemref (attribute) itemscope (attribute) itemtype (attribute) lang (attribute) slot (attribute) spellcheck (attribute) style (attribute) tabindex (attribute) title (attribute) translate (attribute) Elements a abbr address area article aside audio b base bdi bdo blockquote body br button canvas caption cite code col colgroup data datalist dd del details dfn dialog div dl dt em embed fieldset figcaption figure footer form h1 head header hr html i iframe img input input type="button" input type="checkbox" input type="color" input type="date" input type="datetime"-local input type="email" input type="file" input type="hidden" input type="image" input type="month" input type="number" input type="password" input type="radio" input type="range" input type="reset" input type="search" input type="submit" input type="tel" input type="text" input type="time" input type="url" input type="week" ins kbd label legend li link main map mark menu menuitem meta meter nav noscript object ol optgroup option output p param picture pre progress q rp rt rtc ruby s samp script section select slot small source span strong style sub summary sup table tbody td template textarea tfoot th thead time title tr track u ul var video wbr Miscellaneous Attributes Block-level elements CORS enabled image CORS settings attributes Element Inline elements Kinds of HTML content Link types Microdata Optimizing your pages for speculative parsing Preloading content Reference Supported media formats Using the application cache Obsolete acronym applet basefont big blink center command content dir element font frame frameset hgroup image input type="datetime" isindex keygen listing marquee nextid noframes plaintext strike tt xmp
characters

fieldset 元素通常用來對表單中的控制元素進行分組(也包括 label 元素)

內(nèi)容類別

流內(nèi)容，切片根，列出，形式相關(guān)元素，可觸及的內(nèi)容。

允許的內(nèi)容

一個可選的<legend>元素，接著是流內(nèi)容。

標(biāo)記遺漏

沒有，起始和結(jié)束標(biāo)簽都是強制性的。

允許的父母

任何接受流內(nèi)容的元素。

允許ARIA角色

組，演示文稿

DOM界面

HTMLFieldSetElement

注意：與幾乎任何其他元素不同，WHATWG HTML Rendering規(guī)范建議將min-width:min-content作為<fieldset>默認樣式的一部分，許多瀏覽器都實現(xiàn)了這種樣式（或與其近似的東西）。

注：該<fieldset>元素預(yù)計將建立一個新的塊格式上下文。

屬性

 fieldset  中包含所有全局屬性

disabledHTML5如果設(shè)置了這個 bool 值屬性, 它的后代表單控制元素也會繼承這個屬性, 它的首個可選的 legend 元素除外, 例如, 禁止編輯. 該元素和它的子元素不會接受任何瀏覽器事件, 比如點擊或者 focus 事件, 一般來說瀏覽器會將這樣的元素展示位灰色.

formHTML5規(guī)定fieldset所屬的form表單. 這個屬性的值與其所屬的form的ID相同. 默認值是最近的那個form. 

nameHTML5控制元素分組的名稱

該字段集的標(biāo)簽由該字段集的第一個<legend>元素給出。

示例

示例 #1: 一個擁有 fieldset, legend 和 label 的表單

<form action="test.php" method="post">  <fieldset>    <legend>Title</legend>    <input type="radio" id="radio">    <label for="radio">Click me</label>  </fieldset></form>

示例 #2: 利用包含 radioboxes and textboxes 的 fieldset 模擬一個可編輯的 <select> 元素

下面的例子只使用了 HTML 和 CSS. 

請注意, 屏幕朗讀和輔助設(shè)備不能正確的解析下面的表單, 如果不使用正確的元素這個例子是不適合在生產(chǎn)環(huán)境中使用. 

<!doctype html><html><head><meta charset="UTF-8" /><title>Editable [pseudo]select</title><style type="text/css">/* Generic form fields */fieldset.elist, input[type="text"], textarea, select,option, fieldset.elist ul, fieldset.elist > legend,fieldset.elist input[type="text"],fieldset.elist > legend:after {  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;
  box-sizing: border-box;}input[type="text"] {
  padding: 0 20px;}textarea {
  width: 500px;
  height: 200px;
  padding: 20px;}textarea, input[type="text"], fieldset.elist ul,select, fieldset.elist > legend {
  border: 2px #cccccc solid;
  border-radius: 10px;}input[type="text"], fieldset.elist, select,fieldset.elist > legend {
  height: 32px;
  font-family: Tahoma;
  font-size: 14px;}input[type="text"]:hover, textarea:hover,select:hover, fieldset.elist:hover > legend {
  background-color: #ddddff;}select {
  padding: 4px 20px;}option {
  height: 30px;
  padding: 5px 4px;}option:not(:checked), textarea:focus {
  background-color: #ffcccc;}fieldset.elist > legend:after,fieldset.elist label {
  height: 28px;}input[type="text"], fieldset.elist {
  width: 316px;}input[type="text"]:focus {
  background: #ffcccc url("data:image/gif;
  base64,R0lGODlhEAAQANU5APnoxuvr6+uxPdvb2+
  rq6ri4uO7qxunp6dPT06SHV+/rx8vLy+
  nezLO0sbe3t9Ksas+qaaCEV8rKyp2dnf39/
  QAAAK6ursifZHFxcc/
  Qzu3mxYyMjExCJnV1dc6maO7u7o+
  Pj2tXNoaGhtfDpKCDVu3lxM+
  tcaKEV9bW1qOFVWNjY8KrisTExNra2nBbObGxsby8vO/
  mu7Kyso9ZAuzs7MSgAIiKhf///8zMzP///
  wAAAAAAAAAAAAAAAAAAAAAAACH5BAEAADkALAAAAAAQ
  ABAAAAaXwJxwSCwOYzWkMpkkZmoAqDQaJdpqAqw2m53
  NRjlboAarFczomcE0C99o8DgNMVM8Tm3bbYDr9x11Dw
  kzDG5yc2oQJIRCenx/MxoeETM2Q3pxATMlF4MYlo17O
  AsdLispMyAioIY0BzMcITMTKBasjgssFTMqGxItMjYU
  oTQBBAQHxgE0wZcfMtDRMi/QrA022NnaNg1CQQA7")
  no-repeat 2px center !important;}input[type="text"]:focus, textarea:focus,select:focus, fieldset.elist > legend {
  border: 2px #ccaaaa solid;}fieldset {
  border: 2px #af3333 solid;
  border-radius: 10px;}/* Editable [pseudo]select
(i.e. fieldsets with [class=elist]) */fieldset.elist {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  overflow: visible;
  padding: 0;
  margin: 0;
  border: none;}fieldset.elist ul {
  position: absolute;
  width: 100%;
  max-height: 320px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background-color: transparent;}fieldset.elist:hover ul {
  background-color: #ffffff;
  border: 2px #af3333 solid;
  left: 2px;
  overflow: auto;}fieldset.elist ul > li {
  list-style-type: none;
  background-color: transparent;}fieldset.elist label {
  display: none;
  width: 100%;}fieldset.elist input[type="text"] {
  width: 100%;
  height: 30px;
  line-height: 30px;
  border: none;
  background-color: transparent;
  border-radius: 0;}fieldset.elist > legend {
  display: block;
  margin: 0;
  padding: 0 0 0 5px;
  position: absolute;
  width: 100%;
  cursor: default;
  background-color: #ccffcc;
  line-height: 30px;
  font-style: italic;}fieldset.elist:hover > legend {
  position: relative;
  overflow: hidden;}fieldset.elist > legend:after {
  width: 20px;
  content: "\2335";
  float: right;
  text-align: center;
  border-left: 2px #cccccc solid;
  font-style: normal;
  cursor: default;}fieldset.elist:hover > legend:after {
  background-color: #99ff99;}fieldset.elist ul input[type="radio"] {
  display: none;}fieldset.elist input[type="radio"]:checked ~ label {
  display: block;
  width: 292px;
  background-color: #ffffff;}fieldset.elist:hover
input[type="radio"]:checked ~ label {
  width: 100%;}fieldset.elist:hover label {
  display: block;
  height: 100%;}fieldset.elist label:hover {
  background-color: #3333ff !important;}fieldset.elist:hover
input[type="radio"]:checked ~ label {
  background-color: #aaaaaa;}</style></head><body><form method="get" action="test.php"><fieldset>    <legend>Order a T-Shirt</legend>    <p>Write your name (simple textbox):    <input type="text" /></p>    <p>Choose your size (simple select):    <select>        <option value="s">Small</option>        <option value="m">Medium</option>        <option value="l">Large</option>        <option value="xl">Extra Large</option>    </select></p>    <div>What address do you want to use?    (editable pseudoselect)    <fieldset class="elist">        <legend>Address&hellip;</legend>        <ul>            <li><input type="radio" value="1"
            id="address-switch_1" checked            /><label for="address-switch_1"            ><input type="text"
            value="19 Quaker Ridge Rd. Bethel CT 06801"            /></label></li>            <li><input type="radio" value="2"
            id="address-switch_2"            /><label for="address-switch_2"            ><input type="text"
            value="1000 Coney Island Ave.
            Brooklyn NY 11230"            /></label></li>            <li><input type="radio" value="3"
            id="address-switch_3"            /><label for="address-switch_3"            ><input type="text"
            value="2962 Dunedin Cv. Germantown TN 38138"            /></label></li>            <li><input type="radio" value="4"
            id="address-switch_4"            /><label for="address-switch_4"            ><input type="text"
            value="915 E 7th St. Apt 6L. Brooklyn NY 11230"            /></label></li>        </ul>    </fieldset>    </div>    <p>Write a comment:<br />    <textarea></textarea></p>    <p><input type="reset" value="Reset" />    <input type="submit" value="Send!" /></p></fieldset></form></body></html>

規(guī)范

規(guī)范

狀態(tài)

評論

HTML生活標(biāo)準(zhǔn)該規(guī)范中'<fieldset>'的定義。

生活水平

fieldset元素的定義

HTML生活標(biāo)準(zhǔn)

生活水平

建議的字段集和圖例元素的默認呈現(xiàn)

HTML5該規(guī)范中'<fieldset>'的定義。

建議


HTML 4.01規(guī)范該規(guī)范中'<fieldset>'的定義。

建議

初始定義

瀏覽器兼容性

Feature

Chrome

Edge

Firefox (Gecko)

Internet Explorer

Opera

Safari

Basic support

(Yes)

(Yes)

1.0 (1.7 or earlier)

(Yes)

(Yes)

(Yes)

disabled attribute

(Yes)

(Yes)

(Yes)

(Yes)1

12

6

Establish a new block formatting

(Yes)

(Yes)

(Yes)

(Yes)

(Yes)

(Yes)

Feature

Android

Edge

Firefox Mobile (Gecko)

IE Mobile

Opera Mobile

Safari Mobile

Basic support

(Yes)

(Yes)

1.0 (1.0)

(Yes)

(Yes)

(Yes)

disabled attribute

4.4

(Yes)

?

?

?

6.0

Establish a new block formatting

(Yes)

(Yes)

(Yes)

(Yes)

(Yes)

(Yes)

Previous article： Next article：