Tailwind CSS 空白

这个类在顺风 CSS 中接受多个值。所有属性都以类形式覆盖。它是 CSS white-space 属性的替代品。此类用于控制文本换行和空格。此属性中有多种类型的值可供使用。

空白类：

• 空白正常
• whitespace-nowrap
• 空白前
• 空白前行
• 空白预包装

whitespace-normal：这是这个类的默认值。当tailwind 的空白类设置为 normal 时，两个或多个空白的每个序列都将显示为单个空白。元素中的内容将在必要时换行。

句法：

...

例子：

输出：

空白正常

whitespace-nowrap：当tailwind 的空白类设置为nowrap 时，两个或多个空白的每个序列都将显示为单个whitespace 。除非明确指定，否则元素中的内容不会换行。

句法：

...

例子：

HTML

 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Whitespace Class 
    

        

            Geeksforgeeks: A Computer Science portal for Geeks 
            those who wants to persue an engineering degree or
            wants to create a career on engineering field.
        
  
    
 
  
 

输出：

whitespace-nowrap

whitespace-pre：该值使空白具有与 HTML 中的

 标签相同的效果。元素中的内容仅在使用换行符指定时才会换行。

句法： 

...

例子：

 HTML 


 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Whitespace Class 
    

        

            Geeksforgeeks: A Computer Science portal for Geeks 
            those who wants to persue an engineering degree or
            wants to create a career on engineering field.
        
  
    
 
  
 




输出： 

空白前

whitespace-pre-line：当 tailwind 的空白类设置为 pre-line 值时，每个两个或多个空白的序列将显示为单个空白。元素中的内容将在需要和明确指定时被包装。
句法： 

...

例子：

 HTML 


 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Whitespace Class 
    

        

            Geeksforgeeks: A Computer Science portal for Geeks 
            those who wants to persue an engineering degree or
            wants to create a career on engineering field.
        
  
    
 
  
 




输出： 

空白前行

whitespace-pre-wrap：当tailwind 的空白类设置为行前值时，每个空白序列都会按原样显示。元素中的内容将在需要和明确指定时被包装。
句法： 

...

例子：

 HTML 


 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Whitespace Class 
    

        

            Geeksforgeeks: A Computer Science portal for Geeks 
            those who wants to persue an engineering degree or
            wants to create a career on engineering field.
        
  
    
 
  
 




输出： 

空白预包装