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.
} .position-right { background-position: right; } .position-top { background-position: top; } .position-bottom { background-position: bottom; } .position-center { background-position: center; } CSS background-position Property Background Position with Single Values background-pos...
The CSS background-position property specifies the starting position of a background-image. If the default value is set, a background-position will 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 ...
Thebackground-positionproperty specifies the position of the background. The values can be specified in three ways: keywords, percentage values, and position values. Each is discussed in detail below. Keywords This is often displayed as a two-word combination of the following terms, ...
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 property takes two values: the first value represents the horizontal position (left, center, or right), and the second value represents the vertical position (top, center, or bottom). For example, background-position: center top; would center the background image horizontally and align it...
The background-position property allows you to determine the initial position of a background image. This property is not inherited. You can use any combination of a percentage or a length. Alternately, you can use one of the keywords [top, center, bottom] and/or one of the keywords [lef...
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.
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:...