Vetia background-position-x

Vetia background-position-x përcakton vendndodhjen e figurës së sfondit të një elementi horizontalisht.

Vetia mund të marrë vlerat e mëposhtme: left, center, right, si dhe mund të përcaktohet pozicioni i sfondit në përqindje ose në piksel.

Sintaksa

përzgjedhësi {
	background-position-x: vlera;
}

Shembull

Le të pozicionojmë figurën e sfondit majtas horizontalisht:

<div id="elem"></div>

#elem {
	background-position-x: left;
	background-image: url("bg.png");
	background-repeat: no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Shembull

Tani le ta zhvendosim sfondin djathtas:

<div id="elem"></div>

#elem {
	background-position-x: right;
	background-image: url("bg.png");
	background-repeat: no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Shembull

Le të pozicionojmë figurën e sfondit në qendër:

<div id="elem"></div>

#elem {
	background-position-x: center;
	background-image: url("bg.png");
	background-repeat: no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Shembull

Tani le të përcaktojmë pozicionin për sfondin në përqindje:

<div id="elem"></div>

#elem {
	background-position-x: 20%;
	background-image: url("bg.png");
	background-repeat: no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Shihni gjithashtu

vetia background,
që përfaqëson një veti të shkurtuar për sfondin
vetia background-position-y,
e cila përcakton pozicionin e sfondit vertikalisht