বৈশিষ্ট্য 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,
যা পটভূমির জন্য একটি সংক্ষিপ্ত বৈশিষ্ট্য