Tailwind CSS 放置项目

此类接受顺风 CSS 中的许多值。它是 CSS Place Items 属性的替代方案。此类用于控制项目如何同时对齐和对齐。所以place-items类可以保存align-items和justify-items类的值。

放置物品类：

• 放置项目-自动
• 放置项目开始
• 放置项目结束
• 放置项目中心
• 放置项目拉伸

place-items-auto：如果项目没有父项，则使用定义绝对定位的此类。

句法：

...

例子：

输出：

place-items-start：这个类在 flex 容器的开始处显示行。

句法：

...

例子：

HTML

 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Place Items Class 
    
 
        
1
        
2
        
3
        
4
        
5
        
6
    
 
 
  

输出：

place-items-end：这个类在弹性容器的末端显示弹性线。

句法：

...

例子：

HTML

 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Place Items Class 
    
 
        
1
        
2
        
3
        
4
        
5
        
6
    
 
 
  

输出：

place-items-center：这个类在容器的中心对齐弹性项目。

句法：

...

例子：

HTML

 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Place Items Class 
    
 
        
1
        
2
        
3
        
4
        
5
        
6
    
 
 
  

输出：

place-items-stretch：这个类定义了线被拉伸以占据弹性容器的剩余空间。它是默认值。

句法：

...

例子：

HTML

 
 
     
 
  
 
    

        GeeksforGeeks
    
 
    Tailwind CSS Place Items Class 
    
 
        
1
        
2
        
3
        
4
        
5
        
6
    
 
 
  

输出：