视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
HTML5标签嵌套规则_html/css
2020-11-27 16:26:29 责编:小采
文档
点击下载本文 文档为doc格式
 × 目录 [1]分类 [2]子元素 [3]总结

前面的话

　　在html5中，元素的子元素可以是块级元素，这在以前是被认为不符合规则的。本文将详细介绍html5的标签嵌套规则

分类

　　html5出现之前，经常把元素按照block、inline、inline-block来区分。在html5中，元素不再按照display属性来区分，而是按照内容模型来区分，分为元数据型(metadata content)、区块型(sectioning content)、标题型(heading content)、文档流型(flow content)、语句型(phrasing content)、内嵌型(embedded content)、交互型(interactive content)。元素不属于任何一个类别，被称为穿透的；元素可能属于不止一个类别，称为混合的。

　　元数据元素(metadata content)是可以被用于说明其他内容的表现或行为，或者在当前文档和其他文档之间建立联系的元素

base link meta noscript script style template title

　　流元素(flow content)是在应用程序和文档的主体部分中使用的大部分元素

a abbr address area(如果它是map元素的子元素) article aside audio b bdi bdo blockquote br button canvas cite code data datalist del dfn div dl em embed fieldset figure footer form h1 h2 h3 h4 h5 h6 header hr i iframe img input ins kbd keygen label main map mark math meter nav noscript object ol output p pre progress q ruby s samp script section select small span strong sub sup svg table template textarea time u ul var video wbr text

　　区块型元素(sectioning content)是用于定义标题及页脚范围的元素

article aside nav section

　　标题型元素(heading content)定义一个区块/章节的标题

h1 h2 h3 h4 h5 h6

　　语句型元素(phrasing content)是用于标记段落级文本的元素

a abbr area (如果它是map元素的子级) audio b bdi bdo br button canvas cite code data datalist del dfn em embed i iframe img input ins kbd keygen label map mark math meter noscript object output progress q ruby s samp script select small span strong sub sup svg template textarea time u var video wbr text

　　嵌入型元素(embedded content)是引用或插入到文档中其他资源的元素

audio canvas embed iframe img math object svg video

　　交互型元素(interactive content)是专门用于与用户交互的元素

a audio(如果设置了controls属性) button embed iframe img(如果设置了usemap属性) input(如果type属性不为hidden) keygen label object(如果设置了usemap属性) select textarea video (如果设置了controls属性)

子元素

【1】子元素是流元素

、
、、
  • 、、
    、、
    、

    • 　　【1.1】子元素是流元素，不包括

    元素

    、

    　　【1.2】子元素是流元素，但不包括

    元素

    、 
     
    　　【4.1】子元素可以没有、可以是
  • 元素，也可以是 
     
    　　【4.2】子元素可以没有、可以是和元素，也可以是 
     
    　　【4.3】子元素可以没有，可以是，也可以是 
     
    　　【4.4】子元素可以没有，可以是
     
    　　【4.5】子元素可以没有、可以是
     
     
     
     
    　　【4.6】子元素可以没有、也可以是元素，也可以是元素
     
     
    、
     
     
    　　【4.7】子元素可以没有，也可以是
    • 、
      
     
    　　【1.3】子元素是流元素，但不包括
    元素
     
     
     
     
    　　【1.4】子元素是流元素，但不包括
    、
    、
    元素
     
     
    、
    、
     
     
    　　【1.5】子元素是流元素，但不包括
    、
    、区块型元素(sectioning content)、标题型元素(heading content)
     
     
    、
     
     
    　　【1.6】子元素是流元素，但不包括
    、
    、、区块型元素(sectioning content)、标题型元素(heading content)
     
     
     
     
    　　【1.7】子元素是一个
    元素，紧跟着流元素
     
     
     
     
    　　【1.8】子元素是一个元素，紧跟着流元素
     
     
     
     
    【2】子元素是语句型元素
     
     
    、
    、
    、
    、
    、
    、
    、
    、、、、、、、、、
     
     
    　　【2.1】子元素是语句型元素，但不包括和自身相同的元素
     
     
    、、
     
     
    　　【2.2】子元素是语句型元素，但不包括交互型元素(interactive content)
     
     
     
     
    【3】子元素是transparent(以它的父元素允许的子元素为准)
     
     
    、、
     
     
    　　【3.1】子元素是transparent(以它的父元素允许的子元素为准)，但不包括交互型元素(interactive content)
     
     
     
     
    　　【3.2】子元素可以没有、可以是元素，也可以是transparent(以它的父元素允许的子元素为准)
     
     
     
     
    【4】无子元素
     
     
    、
    、、、、、、、、