HTML5 |语义

HTML 标签分为两种类型。

• 语义
• 非语义

语义元素：语义元素具有有意义的名称，可以说明内容的类型。例如页眉、页脚、表格等。HTML5 引入了许多如下所述的语义元素，这些元素使开发人员更容易编写和理解代码，并指示浏览器如何处理它们。

• 文章
• 在旁边
• 细节
• 无花果
• 数字
• 页脚
• 标题
• 主要的
• 标记
• 导航
• 部分

文章：它包含独立的内容，不需要任何其他上下文。
示例：博客文章、报纸文章等。

html

   
      
      
   
   
      

         
GeeksforGeeks
          
A Computer Science Portal for Geeks
 
      
   

输出：

Aside：它用于将内容放在侧边栏中，即在现有内容旁边。它与周围的内容有关。

html

   
      
      
   
   
       
GeeksforGeeks is a Computer Science Portal
 
      

         
GeeksForGeeks
          
GeeksforGeeks is a computer Science platform
            where you can learn good programming.
         
 
      
   

输出：

详细信息和摘要： “详细信息”定义了用户可以隐藏或查看的其他详细信息。 “摘要”定义了“详细信息”元素的可见标题。

html

   
      
      
   
   
      

         
GeeksforGeeks
          
GeeksforGeeks is a Computer Science portal
            where you can learn good programming.
         
 
      
   

输出：

Figure 和 Figcaption：这些用于在网页中添加带有小说明的图像。

html

   
      
      
   
   
      
GeeksforGeeks
      

         
         
GeeksforGeeks Logo
      
   

输出：

Header：顾名思义，它是一个页面的介绍部分的标题。一个页面上可以有多个标题。

html

   
      
      
   
   
      

         

            
GeeksforGeeks
            
GeeksforGeeks
             
A computer Science portal
 
         
      
   

输出：

页脚：页脚位于任何文章或文档的底部，它们可以包含联系方式、版权信息等。一个页面上可以有多个页脚。

html

   
      
      
   
   
      

          
Posted by: GeeksforGeeks
 
          
Contact: 
            geeksforgeeks.org.
         
 
      
   

输出：

Main：定义文档的主要内容。主标签内的内容应该是唯一的。

html

   
      
      
   
   
      

         
Important Residences
          
A few of them are Rashtrapati Bhavan, White House etc
 
         

            
Rashtrapati Bhavan
             
It is the home of the President of India.
 
         
         

            
The White House
             
It is the home of the President of United
               States of America.
            
 
         
      
   

输出：

部分：一个页面可以分成几个部分，如简介、联系信息、详细信息等，这些部分中的每一个都可以在不同的部分标签中。

html

   
      
      
   
   
      

         
Data Structure
          
Data Structure is a data organization and
            storage format that enables efficient access
            and modification.
         
 
      
      

         
Algorithm
          
A process or set of rules to be followed
            in calculations or other problem-solving
            operations, especially by a computer.
         
 
      
   

输出：

nav：用于以导航栏或导航菜单的形式定义一组导航链接。

html

   
      
      
   
   
      
Navigation Bar
      

         Home |
         About Us |
         Data Structure |
         Operating System
      
   

输出：

标记：用于突出显示文本。

html

   
      
      
   
   
      
mark tag
       
GeeksforGeeks is a Computer Science portal
 
   

输出：

非语义元素：像 div、span 这样的标签属于非语义类别，因为它们的名称不能说明它们内部存在什么样的内容。
div是块级元素或节的划分。它用作容器。

html

   
      
      
   
   
      
div Tag
      

         
GeeksforGeeks
          
GeeksforGeeks is a Computer Science portal
 
      
   

输出：

span：它是一个内联元素，它不从新行开始，只占用必要的宽度。有关更多详细信息，请使用 https://www.geeksforgeeks.org/span-tag-html/。

支持的浏览器：

• 谷歌浏览器 6.0 及以上
• Internet Explorer 9.0 及以上
• Mozilla 4.0 及以上
• Opera 11.1 及以上
• Safari 5.0 及以上