Запіс на курсы па HTML, CSS, JavaScript, PHP, Python, фрэймворкам і CMS,
а таксама: дапамога ў пошуку працы і заказаў, стажыроўка на рэальных праектах→
78 of 313 menu

Уласцівасць background-position-x

Уласцівасць background-position-x задае месцазнаходжанне фонавага малюнка элемента па гарызанталі.

Уласцівасць можа прымаць наступныя значэнні: left, center, right, а таксама можна паказаць становішча фону ў працэнтах ці пікселях.

Сінтаксіс

селектар { background-position-x: значэнне; }

Прыклад

Давайце размясцім фонавы малюнак злева па гарызанталі:

<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; }

:

Прыклад

А цяпер давайце перамясцім фон управа:

<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; }

:

Прыклад

Давайце размясцім фонавы малюнак у цэнтры:

<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; }

:

Прыклад

А цяпер пакажам становішча для фону ў працэнтах:

<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; }

:

Глядзіце таксама

  • уласцівасць background,
    якая з'яўляецца ўласцівасцю-скарачэннем для фону
  • уласцівасць background-position-y,
    якая задае пазіцыю фону па вертыкалі
byenru