বৈশিষ্ট্য background-image

বৈশিষ্ট্য background-image একটি উপাদানের জন্য পটভূমির ছবি নির্ধারণ করে। ডিফল্টভাবে, ছবিটি এর কপি দিয়ে সম্পূর্ণ ব্লকটি জুড়ে যাবে, তবে, এই আচরণটি বৈশিষ্ট্য ব্যবহার করে বাতিল করা যেতে পারে background-repeat।

সিনট্যাক্স

cssসিলেক্টর {
  background-image: url(ছবির পথ);
}

cssসিলেক্টর {
  background-image: none;
}

মানসমূহ

ডিফল্ট মান: none।

উদাহরণ

background-image ব্যবহার করে একটি পটভূমির ছবি নির্ধারণ করা যাক, বৈশিষ্ট্য ব্যবহার করে এর পুনরাবৃত্তি নিষিদ্ধ করে background-repeat:

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

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

Результат:

উদাহরণ

background-repeat ছাড়া পটভূমির ছবি সম্পূর্ণ ব্লকটি জুড়ে যাবে:

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

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

Результат:

উদাহরণ

একই সাথে একটি পটভূমির ছবি নির্ধারণ করা যেতে পারে এবং background-color ব্যবহার করে একটি পটভূমির রং নির্ধারণ করা যেতে পারে। এই ক্ষেত্রে, যেখানে পটভূমির ছবি থাকবে না সেখানে পটভূমির রং দেখা যাবে:

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

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

Результат:

আরও দেখুন