CSS Universal সিলেক্টর কি ?
CSS Universal Selector হচ্ছে এমন এক সিলেক্টর যা HTML এর প্রতিটি এলিমেন্ট কে সিলেক্ট করতে পারে । এটিকে * দ্বারা প্রকাশ করা হয়, এবং লেখা হয় নিচের মতো করে ।
* { color:red; }
উপরের সিএসএস কোড টুকু যে HTML Page এ ব্যবহার হবে, সেই পেজের সবগুলো এলিমেন্টের টেক্সট কালার red করে দেবে ।
ইউনিভার্সাল সিলেক্টর কিভাবে ব্যবহার করে ?
যদি কখনও এমন হয় যে একই রুল পুরো পেজের মধ্যে কিংবা একটি নির্দিষ্ট সিলেক্টর এর সবগুলো চাইল্ড কে একই স্টাইল করা লাগবে, তখন আপনি অনায়াসে সিএসএস ইউনিভার্সাল সিলেক্টর ব্যবহার করতে পারেন ।
অনেকের ক্ষেত্রেই দেখা যায় যে ডিফল্ট মার্জিন ও প্যাডিং রিসেট করে নেন এভাবে
* { margin:0; padding : 0; }
এতে করে প্রতিটি এলিমেন্ট, এমন কি ডিফল্ট বাটন গুলোর ও মার্জিন ও প্যাডিং রিসেট হয়ে যায় ।
কিন্তু আমি এর পক্ষে নয়, কারন ওয়েব ব্রাউজার যে ডিফল্ট স্টাইল দেয়, সেটার পুরোটা রিসেট করলে ফর্ম বাটন, ও অন্যান্য ফর্ম এলিমেন্ট গুলো খারাপ দেখায়, পাশাপাশি এগুলোর জন্য কাস্টম সিএসএস ও প্রচুর লেখা লাগে ।
তবে আমি এমনকি অধিকাংশ ওয়েব ডিজাইনার রা ই নিচের কোড ব্লকটি সিএসএস এ সবার উপরে লিখে থাকে
* { box-sizing : border-box; }
box-sizing : border-box; এর কাজ হলো, যেখানে অ্যাপ্লাই হবে, সেখানে বক্সের বেধে দেয়া ওয়াইড কে বাড়াবেনা, বরং প্রয়োজন মতো নিজে ছোট হয়ে যাবে। ফলে কাস্টম গ্রিড তৈরি করা এবং বক্সের সাইজ হিসাব করা অনেক সহজ হয়ে যায় ।
আর যেহেতু box-sizing : border-box; প্রতিটি এলিমেন্টে ডিফল্ট ভাবে থাকেনা, তাই অনেক ফন্ট ইন্ড ডেভেলপার রা এটি ব্যবহার করে ।