Свойството за фон на CSS се използва за дефиниране на фоновите ефекти върху елемента. Има 5 свойства на CSS фон, които засягат HTML елементите:

1. Цвят на фона
2. фоново изображение
3. фоново повторение
4. фон-прикачен файл
5. позиция на фона

1) CSS цвят на фона

Свойството background-color се използва за определяне на цвета на фона на елемента.

Можете да зададете цвета на фона по следния начин:

 h2,p{ background-color: #b0d4de; } <h2>My first CSS page.</h2> <p>Hello Javatpoint. This is an example of CSS background-color.</p> 

Изход:

Моята първа CSS страница.

Здравей Javatpoint. Това е пример за цвят на фона на CSS.

2) CSS фоново изображение

Свойството background-image се използва за задаване на изображение като фон на елемент. По подразбиране изображението покрива целия елемент. Можете да зададете фоново изображение за страница като тази.

 body { background-image: url('paper1.webp'); margin-left:100px; } 

4) CSS фон-прикачен файл

Свойството background-attachment се използва за указване дали фоновото изображение е фиксирано или превъртате с останалата част от страницата в прозореца на браузъра. Ако зададете фиксирано фоново изображение, изображението няма да се движи по време на превъртане в браузъра. Да вземем пример с фиксирано фоново изображение.

 background: white url('bbb.webp'); background-repeat: no-repeat; background-attachment: fixed; 

5) CSS фонова позиция

Свойството background-position се използва за определяне на началната позиция на фоновото изображение. По подразбиране фоновото изображение се поставя в горния ляв ъгъл на уеб страницата.

Можете да зададете следните позиции:

1. център
2. Горна част
3. отдолу
4. наляво
5. точно

 background: white url('good-morning.webp'); background-repeat: no-repeat; background-attachment: fixed; background-position: center;