HTML অর্ডার ও আনঅর্ডার লিস্ট: শিখুন Ordered & Unordered Lists (পর্ব ৪) HTML টিউটোরিয়াল
🔹 HTML List | order list | unorder list |(অর্ডার্ড ও আনঅর্ডার্ড লিস্ট) <ul>, <ol>, <li>
এখানে কোড এবং ব্যাখ্যা, দেওয়া হলো, যাতে তুমি ধাপে ধাপে শিখতে ও বুঝতে পারো!
📌 HTML লিস্ট কী?
📌 HTML-এ লিস্ট ব্যবহার করা হয় একাধিক আইটেম তালিকাবদ্ধভাবে দেখানোর জন্য।
📌 HTML-এ দুই ধরনের লিস্ট আছে:
✅ অর্ডার্ড লিস্ট (<ol>) → নাম্বার বা অক্ষর দিয়ে সাজানো
✅ আনঅর্ডার্ড লিস্ট (<ul>) → বিন্দু বা ডট দিয়ে সাজানো
✅ HTML লিস্টের কোড উদাহরণ:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Lists</title>
</head>
<body>
<h1>HTML Lists Example</h1>
<!-- Unordered List -->
<h2>Unordered List</h2>
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Orange</li>
</ul>
<!-- Ordered List -->
<h2>Ordered List</h2>
<ol>
<li>Wake up</li>
<li>Brush teeth</li>
<li>Have breakfast</li>
</ol>
</body>
</html>
🔹 ১. আনঅর্ডার্ড লিস্ট (<ul>)
👉 "আনঅর্ডার্ড লিস্ট (<ul>) ব্যবহার করা হয় যখন আমাদের আইটেমগুলোর ক্রম গুরুত্বপূর্ণ নয়। সাধারণত এটি ডট (•), বৃত্ত (○) বা স্কয়ার (■) মার্কার দিয়ে সাজানো হয়।"
📌 কোড রেফারেন্স:
✅ <ul> → "লিস্টের শুরু"
✅ <li>Apple</li> → "একটি লিস্ট আইটেম"
💡 অতিরিক্ত তথ্য:
👉 "CSS ব্যবহার করে <ul> এর ডিফল্ট মার্কার পরিবর্তন করা যায়, যেমন circle, square, ইত্যাদি।"
🔹 ২. অর্ডার্ড লিস্ট (<ol>)
👉 "**অর্ডার্ড লিস্ট (<ol>) ব্যবহার করা হয় যখন আইটেমগুলোর ক্রম গুরুত্বপূর্ণ। এটি সংখ্যা (১, ২, ৩) বা রোমান সংখ্যা (I, II, III) দিয়ে সাজানো হয়।"
📌 কোড রেফারেন্স:
✅ <ol> → "অর্ডার্ড লিস্ট শুরু"
✅ <li>Wake up</li> → "প্রথম আইটেম"
💡 অতিরিক্ত তথ্য:
👉 "CSS বা type অ্যাট্রিবিউট ব্যবহার করে নাম্বারিং স্টাইল পরিবর্তন করা যায়, যেমন 1, A, a, I, i ইত্যাদি।"
🔹 ৩. কাস্টম লিস্ট স্টাইল (অতিরিক্ত)
👉 "আমরা CSS দিয়ে লিস্টের স্টাইল কাস্টমাইজ করতে পারি!"
📌 কোড:<ul style="list-style-type: square;">
<li>Custom Bullet 1</li>
<li>Custom Bullet 2</li>
</ul>
<ol type="A">
<li>Step One</li>
<li>Step Two</li>
</ol>
list-style-type: square; → "ডিফল্ট ডটের পরিবর্তে স্কয়ার মার্কার ব্যবহার করে।"
✅ type="A" → "অর্ডার্ড লিস্টে A, B, C দিয়ে নাম্বারিং করে।"
🎯 উপসংহার
👉 "আজ আমরা শিখলাম HTML-এর অর্ডার্ড ও আনঅর্ডার্ড লিস্ট কিভাবে কাজ করে এবং কীভাবে আমরা আমাদের ওয়েবপেজে সুন্দরভাবে তালিকা তৈরি করতে পারি।"
🔥 পরবর্তী ভিডিওতে, আমরা আরও নতুন HTML বিষয় শিখবো! 🚀
