CSS |对象位置属性

CSS 的object-position属性指定图像或视频元素如何在其内容框中使用 x/y 坐标定位。

句法：

object-position:  | initial | inherit 

属性值：

• position：这指定元素的位置。取2个数值，分别对应距content-box左侧的距离和距content-box顶部的距离。也可以使用负值。

  示例#1：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: 10px 30px
      
  
    
  
  

  输出：

  

  示例#2：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: 50% 75%
      
  
    
  
  

  输出：

  

  示例#3：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: left bottom
      
  
    
  
  

  输出：

  

  示例#4：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: center top
      
  
    
  
  

  输出：

  

• initial：设置属性的默认值，即 50% 50%，其中元素位于内容框的中间。

  例子：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: initial
      
  
    
  
  

  输出：

  

• 继承：这从父元素接收属性。当与根元素一起使用时，将使用初始属性。

  例子：

  
    
  
      
      
  
    
  
      
  GeeksforGeeks
      
  object-position: inherit
      
  
          
      
  
    
  
  

  输出：

  

支持的浏览器： object-position属性支持的浏览器如下：

• 谷歌浏览器
• 边缘
• 火狐
• 歌剧
• 苹果浏览器