background-image hassa

background-image hassasy element üçin fon suratyny belleýär. Bellenilýän ýagdaýda surat öz nusgalary bilen tutuş blogy öz içine alar, ýöne bu hereketi background-repeat hassasy ýardamy bilen ýatyryp bolýar.

Sintaksis

cssselektor {
  background-image: url(surat ýoly);
}

cssselektor {
  background-image: none;
}

Mazmunlar

Bellenilýän ýagdaýdaky mazmun: none.

Mysal

background-image ýardamy bilen fon suratyny belleyäris, onuň gaýtalanmagyny background-repeat hassasy ýardamy bilen gadagan edäris:

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

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

Результат:

Mysal

background-repeat bolmasa fon suraty tutuş blogy öz içine alar:

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

css#elem {
  background-image: url("bg.png");
  width: 400px;
  height: 300px;
  border: 3px solid black;
}

Результат:

Mysal

Bir wagtyň özünde fon suratyny belläp we background-color ýardamy bilen fon reňkini belläp bolýar. Bu ýagdaýda, fon suraty bolmadyk ýerde fon reňki görüner:

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

css#elem {
  background-color: orange;
  background-image: url("bg.png");
  background-repeat: no-repeat;
  width: 400px;
  height: 300px;
  border: 3px solid black;
}

Результат:

Şeýle-de görüň