সিএসএস(CSS) কি ?
সিএসএস(CSS ) এব্রিবিয়েশন হচ্ছে ক্যাস্কাইডিং স্টাইল শীট ( Cascading Style Sheet ) । সিএসএস এইচটিএমএল উপাদান সমুহ কিভাবে প্রদর্শন করা হবে তা নির্ধারণ করে। আরও সহজ কথায় ওয়েব পেইজের বিভিন্ন উপাদানের আকার, গঠন, আকৃতি, অবস্থান, রং, ইত্যাদির ডিজাইন বা নির্ধারণের সহজ উপায় হচ্ছে সিএসএস (CSS)। সিএসএস প্রচুর পরিমাণে কাজ করার হাত থেকে রক্ষা করে।
সিএসএস(CSS) এর প্রয়োজন কেনো ?
একটা সময় ছিল যখন ওয়েব সাইটের ডিজাইন শুধুমাত্র HTML দিয়েই করা হতো। সে সময়ে ডিজাইন বলতে একটা ওয়েব পেজের বিভিন্ন ফন্ট এর কালার, সাইজ, টেবিলের বিভিন্ন সেলের কালার, পুরো পৃষ্ঠার ব্যাকগ্রাউন্ড কালার, এবং প্রয়োজনীয় ইমেজ সংযোজনকে বোঝানো হতো। এবং প্রতিটা পেজের প্রতিটা উপাদানের জন্যই আলাদা আলাদাভাবে কালার, সাইজ নির্ধারণ করতে হতো। যাহা ছিলো একটি জটিল প্রক্রিয়া এবং সময় সাপেক্ষ ব্যাপার। বর্তমানে যদি একটা ওয়েব সাইটে ১০০০ বা এর অধিক একই ধরনের পেজ থাকে তাহলেও একটি মাত্র CSS স্ক্রিপ্ট ব্যবহার করে ডিজাইন সম্পূর্ণ করা হয়। বর্তমানে সিএসএস ৩(CSS3) চলে এসেছে। এর আগের ভার্সন হল সিএসএস ২.১। তবে সিএসএস ৩ এখন অধিকাংশ ব্রাউজারে সাপোর্ট করে এবং CSS 3 ব্যবহার দিন দিন বেড়েই চলছে।
CSS এর মাধ্যমে HTML দ্বারা তৈরি করা ওয়েব পেজের বিভিন্ন অংশকে নির্দিষ্ট করে গঠন, আকার, আকৃতি, অবস্থান, রং, গতিশীলতা ইত্যাদি নির্ধারণ করা হয়। Id , Class, Type, Attribute ইত্যাদির উপর ভিত্তি করে এইচটিএমএল এলিমেন্টগুলো খোঁজা বা নির্বাচন করার জন্য সিএসএস সিলেক্টর ব্যবহার করা হয়। এ গুলোর মধ্যে উল্লেখযোগ্য হচ্ছে ….
১। এলিমেন্ট সিলেক্টর
২। ট্যাগ সিলেক্টর
৩। আইডি সেলেক্টর
৪। ক্লাস সিলেক্টর
১। এলিমেন্ট সিলেক্টর ঃ-
এলিমেন্ট সিলেক্টর এলিমেন্টের নামের উপর ভিত্তি করে উপাদান নির্বাচন করে।
২। ট্যাগ সিলেক্টর ঃ-
CSS এ ওয়েব পেজের কোন অংশকে নির্দিষ্টভাবে চিহ্নিত করার জন্য যখন HTML ট্যাগ সমূহ ব্যবহার করা হয় তাকে ট্যাগ সিলেক্টর বলে।
৩। আইডি সিলেক্টর ঃ-
কোন ইউনিক element এর জন্য আমরা id ব্যবহার করে থাকি। একটি পেজ এর মধ্যে ID ইউনিক হওয়া উচিত। কোন element এর নির্দিষ্ট কোন ID কে কল করতে গেলে আমাদের হেস operator ব্যবহার করতে হয়।
যেমন – <div id=”web”>Independent-IT</div> এর জন্য css কোড।
আইডি সিলেক্টর নির্দেশ করার জন্য HTML ট্যাগের মধ্যে id কি-ওয়ার্ড ব্যবহার করা হয় এর পর = চিহ্ন দিয়ে ডাবল কোটেশন এর ভেতরে ক্লাস এর নাম লেখা হয়। যেমন <div id=”web”>। এখানে web আইডির নাম। স্টাইল শীটে আইডিকে চিহ্নিত করতে হেস(#) চিহ্ন ব্যবহার করা হয়। যেমন-
CSS এ ওয়েব পেজের কোন অংশ বা এক বা একাধিক উপাদানকে নির্দিষ্টভাবে চিহ্নিত করার একটি অন্যতম পদ্ধতি ক্লাস সিলেক্টর । একাধিক উপাদানকে একই ক্লাস সিলেক্টর দ্বারা চিহ্নিত করা যায়, তাই এটি কোডিং এর পরিমাণ হ্রাস করতে সাহায্য করে।
যেমন – <div class=”web”>Independent-IT</div> এর জন্য css কোড
ক্লাস সিলেক্টর নির্দেশ করার জন্য HTML ট্যাগের মধ্যে class কি-ওয়ার্ড ব্যবহার করা হয় এর পর = চিহ্ন দিয়ে ডাবল কোটেশন এর ভেতরে ক্লাস এর নাম লেখা হয়। যেমন <div class=”web”>। এখানে mar ক্লাসের নাম। স্টাইল সিটে ক্লাসকে চিহ্নিত করতে ডট(.) চিহ্ন ব্যবহার করা হয়।