This CSS tutorial explains how to use the CSS property called background-position property with syntax and examples. The CSS background-position property defines the initial position of the background-image for an element.
CSS property is used to specify the starting position of a background image within its containing element. It allows web developers to control the alignment of the background image both horizontally and vertically. This property takes two values: the first value represents the horizontal position (...
CSS - background-position Property - CSS background-position property sets the initial position of the element's background image. The position of the image is relative to the value set by background-origin property.
The CSSbackground-positionproperty specifies the starting position of abackground-image. If the default value is set, abackground-positionwill be placed at the top-left corner of an element. And if you set the background to be repeated, it will be repeated both vertically and horizontally. ...
CSS declaration background-image: url(1keydata.gif); background-repeat: no-repeat; background-position: 80px 120px; Result: In this example, the top left corner of the image is located 80px from the left of the element and 120px from the top of the element. ...
background-position:left top; :此属性用于将图像设置在左上方。 <!DOCTYPEhtml> CSS|background-positionProperty body{background-image:url("https://media.geeksforgeeks.org/wp-content/uploads/background-position1.png");background-repeat:no-repeat;background-attachment:fixed;background-position:left ...
CSS background-position-y Property CSS background-position-y 属性用于设置背景图像的初始垂直位置,即用于将图像设置在垂直方向的某个位置。位置相对于后面的定位,可以通过CSS background-origin属性设置。 语法: background-position-y: value; 属性值: top:用于将图片设置在顶部位置。 center:用于将图像设置在垂直...
This example illustrates the use of the background-position property: .example { background-image: url("bg.jpg"); background-repeat: no-repeat; width: 200px; height: 200px; border:1px solid #CCCCCC; } .centerTop { background-position: center top; } .leftBottom { background-position:...
The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin.