HTML <section> এলিমেন্ট কীভাবে ব্যবহার করবেন তা শিখুন।
HTML <section> এলিমেন্টটি একটি ডকুমেন্টে אינডিভিজুয়াল কন্টেন্ট সেকশন রিপ্রেজেন্ট করার জন্য কন্টেইনার এলিমেন্ট হিসেবে ব্যবহৃত হয়।
আপনার একটি ওয়েব পেজ থাকতে পারে যেটিতে আপনার কোম্পানির বিভিন্ন তথ্য দেখানোর জন্য একাধিক সেকশন থাকে। উদাহরণস্বরূপ:
- হিরো সেকশন
- সার্ভিসেস সেকশন
- টিম সেকশন
- স্পন্সরস সেকশন
- কন্টাক্ট 어স সেকশন
প্রতিটি সেকশনকে সেলফ-কন্টেইনড সেকশন হিসেবে এনক্যাপসুলেট করা যায়:
<section> <h2>একটি সেকশন ১</h2> <p>...</p> <img src="" alt="" /> </section> <section> <h2>একটি সেকশন ২</h2> <p>...</p> <img src="" alt="" /> </section> <section> <h2>একটি সেকশন ৩</h2> <p>...</p> <img src="" alt="" /> </section>
<section> এলিমেন্টের আরেকটি ব্যবহার <article> এলিমেন্টের ভিতরে।
মান লইয়ে নিন আপনার একটি লং-ফর্ম আর্টিকেল আছে যা একাধিক টপিক আলোচনা করে। সেটি বিভিন্ন টপিক সেকশনে ভাগ করার জন্য <section> এলিমেন্ট ব্যবহার করতে পারেন:
<article> <h1>মেইন পোস্ট টাইটেল</h1> <section> <h2>টপিক ১</h2> <p>...</p> <img src="" alt="" /> </section> <section> <h2>টপিক ২</h2> <p>...</p> <img src="" alt="" /> </section> <section> <h2>টপিক ৩</h2> <p>...</p> <img src="" alt="" /> </section> </article>
আপনি <article> এলিমেন্টও <section> এলিমেন্টের ভিতরে রাখতে পারেন।
মান লইয়ে নিন আপনার ফ্রন্ট পেজে একটি সেকশন আছে যেখানে আর্টিকেল কার্ডের লিস্ট দেখানো হয়, প্রতিটা ইনডিভিজুয়াল পোস্টের লিংক ধারণ করে:
<section> <h2>আমাদের লেটেস্ট ব্লগ পোস্টগুলো দেখুন</h2> <article> <a href="/path-to-blog-post-1"> <h3>ব্লগ পোস্ট ১</h3> </a> </article> <article> <a href="/path-to-blog-post-2"> <h3>ব্লগ পোস্ট ২</h3> </a> </article> <article> <a href="/path-to-blog-post-3"> <h3>ব্লগ পোস্ট ৩</h3> </a> </article> </section>
<section> ট্যাগ কন্টেইনার এলিমেন্ট ডিফাইন করার জন্য ব্যবহৃত অনেক HTML ট্যাগের একটি। সবচেয়ে কমন ব্যবহৃত HTML কন্টেইনার এলিমেন্টগুলো হচ্ছে:
<article> , <main> , <header>, <footer>,<form>, এবং <div> , (যেটি একটি জেনেরিক ট্যাগ যা আমরা ব্যবহার করি যদি অন্য ট্যাগগুলো প্রযোজ্য না হয়)।