CSS | margin-top 属性

CSS 中的 margin-top 属性用于设置元素的上边距。它设置元素顶部的边距区域。 margin-top 属性的默认值为 0。

句法：

margin-top: length|auto|initial|inherit;

属性值：

• length：用于以固定值指定边距的长度。该值可以是正数、负数或零。

  句法：

  margin-top: length;

  例子：

  
  
      
          
            
          
          
      
            
      
            
          
          
  
              This paragraph has 50px top margin .
          
      
                      
  

  输出：
  

• 百分比 (%)：用于指定边距量，以相对于包含元素宽度的百分比表示。

  句法：

  margin-top: %;

  例子：

  
  
      
          
            
          
          
      
            
      
            
          
          
  
              This paragraph has 5% top margin .
          
      
                      
  

  输出：
  

• auto：当浏览器确定 margin-top 时使用此属性。

  句法：

  margin-top: auto;

  例子：

  
  
      
          
            
          
          
      
            
      
            
          
          
  
              margin-top: auto;
          
      
                      
  

  输出：
  

• initial用于将 margin-top 属性设置为其默认值。

  句法：

  margin-top: initial;

  例子：

  
  
      
          
            
          
          
      
            
      
            
          
          
  
              margin-top: initial;
          
      
                      
  

  输出：
  

• 继承：当 margin-top 属性从其父级继承时使用。

  句法：

  margin-top: inherit;

  例子：

  
  
      
          
            
          
          
      
            
      
            
          
  
                
              
              
  
                  margin-top: inherit;
              
          
      
                      
  

  输出：
  

注意：元素的顶部和底部边距有时会折叠为一个边距，该边距等于两个边距中最大的一个。这不会发生在水平(左侧和右侧)边距上，而只会发生在垂直(顶部和底部)边距上。它被称为保证金崩溃。

支持的浏览器： margin-top 属性支持的浏览器如下：

• 谷歌浏览器 1.0
• 浏览器 6.0
• 火狐 1.0
• 歌剧 3.5
• Safari 1.0