📜  哪些标签同时包含 HTML 中的开始和结束标签?

📅  最后修改于: 2022-05-13 01:56:24.667000             🧑  作者: Mango

哪些标签同时包含 HTML 中的开始和结束标签?

HTML 标签帮助网络浏览器将 HTML 文档转换为网页。标签总是括在尖括号 < > 中。标签不区分大小写

因此,为了更好地了解哪些标签在本质上是打开和关闭的,我们可以将它们分为 4 个部分。

  • 文档结构标签
  • 语义标签
  • 表格标签
  • 容器标签

文档结构标签:

  • html 标签: HTML 文档的打开和关闭标签。

    句法:

     ... 
  • head 标签: 和 标签由 元素分隔,该元素是标题数据的容器。

    句法:

     ... 
  • body 标签:以下渲染网页上显示的所有内容。文档的正文由 标签定义。 元素包含 HTML 文档的所有内容,包括标题、段落、图形、超链接、表格、列表等。

    句法:

     ... 
  • 标题标签:标题标签允许您指定网页的标题。此标题出现在浏览器标题栏中。

     ... <title></code></pre></div></li></ul><p><strong>示例 1:</strong>以下示例演示<strong> </strong>在浏览器标题栏中将<strong>标题</strong>作为“标记示例”。 <strong>body</strong>标记在 Web 浏览器中呈现所有数据。</p><div><h5 class="code">HTML</h5><div class="hcb_wrap"><pre class="prism undefined-numbers lang-html" data-lang="HTML"><code class="replace"><!DOCTYPE html>
    <html>
      <head>
        <title>Tag Example
      
      
        This is an example for GeeksforGeeks HTML tags.
      
    


    HTML
    
    
      
        Tag Example
      
      
        
          
    A heading here
          
                        

    GeeksforGeeks GeeksforGeeks GeeksforGeeks GeeksforGeeks

                     

    GeeksforGeeks GeeksforGeeks GeeksforGeeks GeeksforGeeks

          
             
    Write footer here
        
      


    HTML
    
    
      
        
      
      
        

    GeeksforGeeks Employee's Saving

                                                                                                                                                                                                             
    Namesaving
    Kishan$200
    Pradumna$150
    Riya$50
    Rohan$100
    Samaksh$170
      


    HTML
    
    
      
        Container Tags
      
      
        

    H1 Heading

        

    H2 heading

        

    H3 Heading

        

    H4 Heading

        
    H5 Heading
        
    H6 Heading
        Link     

    GeeksforGeeks

      


    HTML
    
    
      
        Container Tags
      
      
        Bold
        

    GeeksforGeeks

           emphasize the text     
            
    1. Coffee
    2.       
    3. Tea
    4.       
    5. Milk
    6.     
           
            
    • Coffee
    •       
    • Tea
    •       
    • Milk
    •     
      


输出:

语义标签: 语义元素具有有意义的名称,可以说明内容的类型。

  • 标题标签:它呈现介绍页面(例如标题)或页面一部分的信息。

    句法:

    ...
  • nav 标签:它定义了一个导航栏,其中包含一组菜单或一个超链接菜单。

    句法:

  • main标签:包含网页的主要内容。

    句法:

    ...
  • 旁边标记:它呈现仅与页面的主要部分有远距离链接的信息

    句法:

  • 页脚标签:页面的页脚或页面的一部分位于页面底部。在大多数情况下,页脚提供与内容相关的信息,例如作者和版权声明。

    句法:

    ...
  • 文章标签:此标签指定独立的、自包含的内容。这无济于事,但如果我们想应用 CSS,它就会以这种方式工作。

    句法:

    ...

示例 2:以下代码演示了一些语义标签。

HTML



  
    Tag Example
  
  
    
      
A heading here
      
                    

GeeksforGeeks GeeksforGeeks GeeksforGeeks GeeksforGeeks

                 

GeeksforGeeks GeeksforGeeks GeeksforGeeks GeeksforGeeks

      
         
Write footer here
    
  

输出:

表标签: HTML 表格是按行和列排列的数据,或者可能是更复杂的结构。

  • 表格标签:它将表格呈现给网页。

    句法:

     ... 
  • tr 标签: 显示表格行。

    句法:

     ... 
  • th 标签:它显示表格的列名,或者我们可以说标题行。

    句法:

     ... 
  • td 标签:显示表格数据。

     ... 

示例 3:以下代码演示了表格标签。

HTML



  
    
  
  
    

GeeksforGeeks Employee's Saving

                                                                                                                                                                                                         
Namesaving
Kishan$200
Pradumna$150
Riya$50
Rohan$100
Samaksh$170
  

输出:

容器标签: 容器标签一般分为三个部分,即开始标签、内容(将显示在浏览器上)和结束标签。在内容部分,它们还可以包含一些其他标签。

  • 标题标签: HTML 标题标签用于定义页面的标题。

    句法:

    ...

    ...

    ...

    ...

    ...
    ...
  • 段落标签: HTML 中的

    标签定义了一个段落。

    句法:

    ...

  • div 标签:内容块的容器。

    句法:

    ...
  • span 标签:内嵌内容的容器,例如段落内的内容。

    句法:

     ... 
  • em 标签:这个标签给出了包含的文本强调(通常是斜体)。

    句法:

     ... 
  • strong 标签:此标签使内容变为粗体。

    句法:

    ...
  • 一个标签:这个标签将链接添加到文本中。

    句法:

  • ol 标签:此标签用于有序列表。

    句法:

      ...
  • ul 标签:这个标签用于无序列表。

    句法:

      ...
  • li 标签:此标签用于项目列表

    句法:

  • ...
  • 示例 4:以下代码演示了容器标签。

    HTML

    
    
      
        Container Tags
      
      
        

    H1 Heading

        

    H2 heading

        

    H3 Heading

        

    H4 Heading

        
    H5 Heading
        
    H6 Heading
        Link     

    GeeksforGeeks

      

    输出:

    示例 5:以下代码演示了容器标签。

    HTML

    
    
      
        Container Tags
      
      
        Bold
        

    GeeksforGeeks

           emphasize the text     
            
    1. Coffee
    2.       
    3. Tea
    4.       
    5. Milk
    6.     
           
            
    • Coffee
    •       
    • Tea
    •       
    • Milk
    •     
      

    输出: