Semantic-UI 卡片元数据内容

Semantic UI 是一个开源框架，它使用 CSS 和 jQuery 构建出色的用户界面。它与使用的引导程序相同，并且具有许多不同的元素可用于使您的网站看起来更加令人惊叹和响应迅速。

语义 UI Card 元素以类似于使用语义 UI 类的扑克牌的方式显示站点内容。语义 UI 卡有多个部分，例如内容、额外内容、元和描述。在本文中，我们将了解语义 UI 卡的元块。

语义 UI 卡片元数据块存储卡片的元数据。要将元数据添加到语义 UI 中的卡片，我们使用元类。在一张卡片中，可以有多个

类元。此类增加了文本的透明度，从而使其不那么集中于视图。

Semantic-UI Card 元块类：

• meta：这个类用于向卡片添加元数据，包含卡片中最不重要的信息，这些信息应该存在于卡片中，但不应该是关注的焦点。

句法：

   

           ......
   

示例 1：以下示例演示语义 UI 卡的元类。我们可以观察到普通文本和元类文本之间的差异。

HTML

 

  

 

  
    
GeeksforGeeks
    Semantic UI card meta block
  

 
  

    

       This is normal content text.
      
This is text with meta class.
      
 Normal H1 heading.
      
Meta H1 heading
    
  

 

输出：

输出

示例 2：以下示例演示语义 UI 卡的元块。我们可以使用元类观察卡片的不同部分。

HTML

 

    

 

  
    
GeeksforGeeks
    Semantic UI card meta block
  

 
  

    

      
Header
      
Meta
    
 
    

       
    
 
    

      
Meta
      

        

           

              This is implementation of summary class.
           
 
           

              This is implementation of meta class.
           
        
      
    
 

   

输出：

输出

参考： https ://semantic-ui.com/views/card.html#metadata