Pre নাকি Code ট্যাগ? কোনটা তোমার দরকার?

Pre Vs Code

pre আর code দুইটার কাজই এক। পার্থক্যটা হয় display প্রোপার্টিতে।

আমরা pre আর code দুটো ট্যাগই মূলত ব্যবহার করি ওয়েবপেজে কোড দেখানোর ক্ষেত্রে। pre হলো “Preformatted Text” এর সংক্ষিপ্ত রূপ। আর code তো code-ই। সেক্ষেত্রে code ট্যাগটি সিমানটিক্যালি pre এর চাইতে ভালো।
দুজনের কাজই কোড উল্লেখ হলেও কাজের ক্ষেত্রটা কিন্তু এক না। এদের মূল পার্থক্য হলো:

1. pre ট্যাগের display প্রোপার্টি ভ্যালু block সেট করা থাকে। অর্থাৎ display: block;
2. code ট্যাগের ক্ষেত্রে display: inline;

অর্থাৎ:

pre {
  display: block;
}
code {
  display: inline;
}

( display প্রোপার্টি সম্বন্ধে ধারণা না থাকলে এই আর্টিকেলটা দেখ: CSS Layout - The display Property )

এই যেমন আমি উপরের কোড বক্সটা দিলাম, এটা আমি দিয়েছি একটা pre ট্যাগের ভিতরে। আর এই যে মাত্র লাল রং দিয়ে pre লিখলাম, এটা করেছি code ট্যাগের সাহায্যে। ( তোমরা চাইলে ব্রাউজারে ইনস্পেক্ট করে দেখতে পার )

তো আমরা চাইলে কিন্তু code ট্যাগটাকে pre-এর মতো করে ব্যবহার করতে পারি খুব সহজেই:

code {
  display: block;
}

আশা করি এখন ব্যাপারটা পরিষ্কার, রাইট? কোনো প্রশ্ন থাকলে কমেন্ট বক্সে করতে পার।😊
আসসালামু আলাইকুম।