在 Tailwind CSS 的强大体系中，Margin 类通过实用的形式涵盖了所有的外边距属性。它是原生 CSS Margin Property 的绝佳替代方案。我们可以使用这个类在元素周围创建空间，这些空间位于任何定义的边框之外。此外，我们可以为单个侧面（上、右、下、左）设置不同的外边距。值得注意的是，添加边框属性对于直观地展示外边距类的效果非常重要。虽然在原生 CSS 中我们需要使用 INLINECODEdea7ea18、INLINECODEb5c5a7f1、INLINECODEfbd61c84 和 INLINECODE0d317cd3 等属性，但在 Tailwind 中，我们可以通过类名更高效地完成这些工作。

#### 外边距类

• m-0: 这个类用于在所有侧边定义外边距。
• -m-0: 这个类用于在所有侧边定义负外边距。
• my-0: 这个类用于在 Y 轴上定义外边距，即 margin-top 和 margin-bottom。
• -my-0: 这个类用于在 Y 轴上定义负外边距，即 margin-top 和 margin-bottom。
• mx-0: 这个类用于在 X 轴上定义外边距，即 margin-left 和 margin-right。
• -mx-0: 这个类用于在 X 轴上添加负外边距。
• mt-0: 这个类专门用于在顶部添加外边距。
• -mt-0: 这个类专门用于在顶部添加负外边距。
• mr-0: 这个类专门用于在右侧添加外边距。
• -mr-0: 这个类专门用于在右侧添加负外边距。
• mb-0: 这个类专门用于在底部添加外边距。
• -mb-0: 这个类专门用于在底部添加负外边距。
• ml-0: 这个类专门用于在左侧添加外边距。
• -ml-0: 这个类专门用于在左侧添加负外边距。

#### 注意：

我们可以将数字 "0" 替换为有效的 "rem" 值。

m-0: 这个类用于在所有侧边定义外边距。
语法：

...

示例：

 

  
 
     
 

 
    

        极客教程
    
 
    Tailwind CSS Margin 类 
    

    

        

        
    
    
 

输出：

!image

-m-0: 这个类用于在所有侧边定义负外边距。
语法：

...

示例：

 

  
 
     
 

 
    

        极客教程
    
 
    Tailwind CSS Margin 类 
    

    

        

        
    
    
 

输出：

!image

my-0: 这个类用于在 Y 轴上定义外边距，即 margin-top 和 margin-bottom。
语法：

...

示例：

 

  
 
     
 

 
    

        极客教程
    
 
    Tailwind CSS Margin 类 
    

    

        

        
    
    
 

输出：

!image

-my-0: 这个类用于在 Y 轴上定义负外边距，即 margin-top 和 margin-bottom。
语法：

...