HTML 5 中哪些元素的标签是可以省略的

我们知道,在HTML语言中,HTML元素是HTML文档的基本组成单元。在HTML语法中,大多数元素包含一个开始标签、一个结束标签,以及标签中的内容,类似于:<xxx>内容</xxx>。
但是在HTML 5中,有一些元素的标签是可以省略的,下面本文就对这些元素做一个大致的介绍。

<html>元素
如果<html>元素中的第一个内容不是注释,则可以省略起始标签。 如果<html>元素后面没有紧接一个注释,则可以省略结束标签。
<head>元素
如果<head>元素为空,或者<head>元素中的第一个内容是一个HTML元素,则可以省略起始标签。 如果<head>元素后不紧跟空格字符或注释,则可以省略结束标签。
<base>元素
没有结束标签。
<link>元素
没有结束标签。
<meta>元素
没有结束标签。
<body>元素
如果<body>元素为空,或者<body>元素中第一个内容不是空格或注释,则起始标签可以省略,除非<body>元素中第一个内容是一个<meta>,<link>,<script>,<style>或者<template>元素。如果<body>元素后面不是紧跟一个注释,则结束标签可以省略。
<p>元素
如果一个<p>元素后面紧跟一个<address>,<article>,<aside>,<blockquote>,<details>,<div>,<dl>,<fieldset>,<figcaption>,<figure>,<footer>,<form>,<h1>,<h2>,<h3>,<h4>,<h5>,<h6>,<header>,


,<main>,<menu>,<nav>,<ol>,<p>,<pre>,<section>,<table>,<ul>元素,或者在父元素中没有更多内容,且该父元素不是一个<a>,<audio>,<del>,<ins>,<map>,<nonscript>,<video>元素,结束标签可以省略。
<li>元素
如果一个<li>元素之后紧跟另一个<li>元素,或在父元素中没有其他更多内容,则结束标签可以省略。
<dt>元素
如果一个<dt>元素后面紧跟另一个<dt>元素或<dd>元素,则结束标签可以省略。
<dd>元素
如果一个<dd>元素后面紧跟另一个<dd>元素或<dt>元素,或者父元素中没有更多其他内容,则结束标签可以省略。
<img>元素
没有结束标签。
<area>元素
没有结束标签。
<colgroup>元素
如果一个<colgroup>元素之后不是紧跟一个空格或注释,则结束标签可以省略。
<col>元素
没有结束标签。
<tbody>元素
如果一个<tbody>元素中的第一个内容是一个<tr>元素,且这个<tbody>元素之后不是紧跟在一个已省略结束标签的<tbody>,<thead>,<tfoot>元素之后,则<tbody>元素的起始标签可以省略(如果这个<tbody>元素是空的,则不可以省略)。如果一个<tbody>元素之后紧跟一个<tbody>元素或者<tfoot>元素,且父元素中没有更多其他元素,则结束标签可以省略。
<thead>元素
如果一个<thead>元素之后紧跟一个<tbody>或<tfoot>元素,则结束标签可以省略。
<tfoot>元素
如果一个<tfoot>元素之后紧跟一个<tbody>元素,或者父元素中没有更多其他元素,则结束标签可以省略。
<tr>元素
如果一个<tr>元素之后紧跟另一个<tr>元素,或者父元素中没有更多其他元素,则结束标签可以省略。
<td>元素
如果一个<td>元素之后紧跟另一个 <td>或<th>元素,或者父元素中没有更多其他元素,则结束标签可以省略。
<th>元素
如果一个<th>元素之后紧跟另一个 <td>或<th>元素,或者父元素中没有更多其他元素,则结束标签可以省略。
<colgroup>元素
如果一个<colgroup>元素之后没有紧跟一个空格或注释,则结束标签可以省略。
<col>元素
没有结束标签。
<input>元素
没有结束标签。
<optgroup>元素
如果一个<optgroup>元素之后紧跟另一个<optgroup>元素,或在父元素中没有更多内容,则结束标签可以省略。
<option>元素
如果一个<option>元素之后紧跟另一个<option>元素,或者紧跟一个<optgroup>元素,或者在父元素中没有更多的内容,则结束标签可以省略。

以上介绍的元素,或是无条件省略结束标签,或是满足某一条件下可省略开始或结束标签,其省略的原则皆为不会造成文档的歧义。在实际应用中,需要多加练习才能熟练掌握,对于入门者,在无法确定某个元素的标签是否可以省略的情况下,还是建议写全,以免一旦出现错误,在标签众多的情况下排查起来比较困难。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 我们知道,在HTML语言中,HTML元素是HTML文档的基本组成单元。在HTML语法中,大多数元素包含一个开始标签...
    七里之境阅读 9,842评论 0 1
  • 要以省略全部标记的元素: 1.html:如果html第一个内容不是注释就可以省略html开始标签,如果html末尾...
    PYFang阅读 5,921评论 0 0
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,654评论 1 41
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,981评论 1 45
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92