Xüsusiyyət background-image

background-image xüsusiyyəti elementə fon şəkli təyin edir. Əslanda şəkil öz kopyaları ilə bütün bloku doldurar, lakin bu davranış background-repeat xüsusiyyəti ilə ləğv edilə bilər.

Sintaksis

selektor {
	background-image: url(şəklin yolu);
}

selektor {
	background-image: none;
}

Qiymətlər

Qiymət	İzah
`url`	Şəkil faylına olan yol. Şəklin adı dırnaq işarəsi içində, tək dırnaq içində və ya ümumiyyətlə dırnaqsız ola bilər.
`none`	Element üçün fon şəklini ləğv edir.

Standart qiymət: none.

Nümunə

background-image ilə fon şəkli təyin edək, background-repeat xüsusiyyəti ilə onun təkrarını qadağan edək:

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

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

Nümunə

background-repeat olmadan fon şəkli bütün bloku doldurar:

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

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

Nümunə

Eyni zamanda fon şəkli təyin etmək və background-color xüsusiyyəti ilə fon rəngi təyin etmək olar. Bu halda, fon şəklinin olmadığı yerdə fon rəngi görünəcək:

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

Həmçinin bax

fon üçün qısa xüsusiyyət təşkil edən background xüsusiyyəti