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 ගුණය,
පසුබිම සඳහා කෙටි අංකන ගුණයක් ලෙස ක්‍රියා කරයි