用于居中对齐的 Blaze UI 实用程序

Blaze UI是一个免费的开源 UI 工具包，它为快速构建网站提供了一个很好的结构，具有可扩展和可维护的基础。 Blaze UI 中的所有组件都是移动优先开发的，并且仅依赖于原生浏览器功能，而不是单独的库或框架。它帮助我们以一致的风格快速高效地创建可扩展且响应迅速的网站。

在本文中，我们将学习垂直和水平方向的文本内容实用程序的居中对齐。

Blaze UI 对齐居中的类：

u-center-block：该类用于将 HTML div 设置为居中块。
u-center-block__content：该类用于将HTML div的内容设置为居中块。
u-center-block__content–vertical：该类用于将内容的垂直对齐设置为居中块。
u-center-block__content–horizontal：该类用于将内容的水平对齐设置为居中块。

句法：

...

示例 1：以下代码演示了使用上述类的默认居中对齐方式。

HTML



  

    
    
    
  
    

  

    
        
            GeeksforGeeks
        
          
        Blaze UI alignment centered
        


  
        
            
                This alignment is centered.

HTML



  

    
    
    
  
    

  

    
        
            GeeksforGeeks
        
          
        Blaze UI vertical centered alignment 
        


  
        
            
                Centered text

HTML



  

    
    
    
  
    

  

    
        
            GeeksforGeeks
        
          
        Blaze UI horizontal centered alignment 
        


  
        
            
                Centered text

输出：

示例 2：以下代码演示了使用上述类的内容的垂直居中对齐方式。

HTML



  

    
    
    
  
    

  

    
        
            GeeksforGeeks
        
          
        Blaze UI vertical centered alignment 
        


  
        
            
                Centered text

输出：

示例 3：以下代码演示了使用上述类的内容的水平居中对齐方式。

HTML



  

    
    
    
  
    

  

    
        
            GeeksforGeeks
        
          
        Blaze UI horizontal centered alignment 
        


  
        
            
                Centered text

输出：

参考： https://www.blazeui.com/utils/alignment