语义UI |图片

Semantic UI 是一个开源框架，它使用 CSS 和 jQuery 来构建出色的用户界面。它与使用的引导程序相同，并且有很多不同的元素可以用来使您的网站看起来更神奇。它使用一个类向元素添加 CSS。
使用语义 UI 将图像放入我们的 Web 应用程序中有不同的风格，以使网站看起来更棒。您可以放置图像或 SVG。
让我们看一些如何使用语义 UI 放置图像的示例。

示例：此示例使用语义用户界面显示一个简单的图像。

HTML

  

    Semantic UI
    
  
    
    

  

    
        Image
        
    

  

输出：

示例：此示例为图像添加边框。

HTML

    
        Semantic UI
        
    
  
    
        
            Bordered Image
            
        
        
      
    

输出：

您可以通过在 IDE 中运行示例来准确地看到边框。

示例：此示例创建圆形图像。

HTML

    
        Semantic UI
        
    
  
    
        
            Circular Bordered Image
            
        
        
      
    

输出：

示例：此示例创建垂直对齐的图像。

HTML

    
        Semantic UI
        
    
  
    
        
            Vertically Aligned Images
            
            Aligned at Top
            
            
            Aligned at Middle
            
            
            Aligned at Bottom
        
        
      
    

输出：

注意：您可以添加类 mini、tiny、small、medium、large、mass 来改变大小。您可以通过单击在 IDE 上运行来运行此示例中的任何一个。