CSS-এ display প্রপার্টি নিয়ে কাজ

আপনি ইতিমধ্যেই জানেন যে সমস্ত ট্যাগ একটি নির্দিষ্ট ব্লক মডেলের অন্তর্গত। ইচ্ছা করলে, তবে, display প্রপার্টি ব্যবহার করে মডেলটি পরিবর্তন করা যেতে পারে। এই প্রপার্টির block মান ব্যবহার করে একটি এলিমেন্টকে ব্লক এলিমেন্ট বানানো যায়, এবং inline মান ব্যবহার করে - ইনলাইন বানানো যায়।

আসুন span ট্যাগগুলোকে ব্লক এলিমেন্টের মতো আচরণ করাই:

html<span>text</span>
<span>text</span>
<span>text</span>

cssspan {
  display: block;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-bottom: 20px;
}

Результат:

এবং এখন div ট্যাগগুলোকে ইনলাইনের মতো আচরণ করাই:

html<div>text</div>
<div>text</div>
<div>text</div>

cssdiv {
  display: inline;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат: