A background-position-y tulajdonság

A background-position-y tulajdonság egy elem háttérképének függőleges helyzetét határozza meg.

A tulajdonság a következő értékeket veheti fel: top, center, bottom, valamint a háttér pozíciója megadható százalékban vagy pixelben is.

Szintaxis

cssszelektor {
  background-position-y: érték;
}

Példa

Helyezzük a háttérképet felülre függőlegesen:

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

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

Результат:

Példa

Most pedig helyezzük a hátteret középre:

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

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

Результат:

Példa

Most adjuk meg a háttér pozícióját százalékban:

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

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

Результат:

Lásd még