2. CSS Selectors
📘 কনসেপ্ট (থিওরি)
সিলেক্টর নির্ধারণ করে কোন HTML এলিমেন্টগুলো স্টাইল করতে হবে। বিভিন্ন ধরন আছে:
**এলিমেন্ট সিলেক্টর**: একটি ধরনের সব এলিমেন্ট টার্গেট করে
p { color: blue; }
**ক্লাস সিলেক্টর**: নির্দিষ্ট class যুক্ত এলিমেন্ট টার্গেট করে (আগে
. দিতে হয়)
.highlight { background: yellow; }
**ID সিলেক্টর**: একটি অনন্য এলিমেন্ট টার্গেট করে (আগে
# দিতে হয়)
#main-title { font-size: 2rem; }
**গ্রুপিং**: একাধিক সিলেক্টরে একই স্টাইল
h1, h2, h3 { color: blue; }
**ডিসেন্ড্যান্ট**: নেস্টেড এলিমেন্ট টার্গেট
div p { color: red; } /* div এর ভেতরের p */
**ইউনিভার্সাল**: সবকিছু টার্গেট
* { margin: 0; padding: 0; }
💡 উদাহরণ
বিভিন্ন সিলেক্টরের ব্যবহার:
বিশেষ কার্ড
এই কার্ডে বর্ডার আছে।
সাধারণ কার্ড
এখানে বর্ডার নেই।
🎯 আপনার কাজ (প্র্যাকটিস)
"card" ক্লাসসহ ৩টি div কার্ড তৈরি করুন। দ্বিতীয়টিকে "featured" id দিয়ে বিশেষ বর্ডার রঙ দিন।
main.css
Loading...
OUTPUT
Run your code to see the output here...