АКЦЫЯ: бясплатныя месячныя курсы па стварэнні сайтаў
на выбар: вёрстка, JavaScript, PHP, Python або фрэймворкі. Сёння апошні дзень для запісу! Націскай!
72 of 313 menu

Уласцівасць background-image

Уласцівасць background-image задае фонавы малюнак элементу. Па змаўчанні малюнак замастуе сваімі копіямі ўвесь блок, аднак, гэту паводлівасць можна адмяніць з дапамогай уласцівасці background-repeat.

Сінтаксіс

селектар { background-image: url(шлях да малюнка); }
селектар { background-image: none; }

Значэнні

Значэнне Апісанне
url Шлях да файла з малюнкам. Назва малюнка можа быць у двайных двукоссі, адзінарных і наогул без двукоссяў.
none Адмяняе фонавы малюнак для элемента.

Значэнне па змаўчанні: none.

Прыклад

Зададзім фонавы малюнак з дапамогай background-image, забараніўшы яго паўтарэнне з дапамогай уласцівасці background-repeat:

<div id="elem"></div> #elem { background-image: url("bg.png"); background-repeat: no-repeat; width: 400px; height: 300px; border: 3px solid black; }

:

Прыклад

Без background-repeat фонавы малюнак замастуе сабой увесь блок:

<div id="elem"></div> #elem { background-image: url("bg.png"); width: 400px; height: 300px; border: 3px solid black; }

:

Прыклад

Можна адначасова задаваць фонавы малюнак і задаваць фонавы колер з дапамогай background-color. У гэтым выпадку там, дзе не будзе малюнка фона - будзе фонавы колер:

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

:

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

  • уласцівасць background,
    якое ўяўляе сабой уласцівасць-скарачэнне для фона
byenru