18/06/2022
CSS এর মৌলিক ধারনা :-
CSS: সিএসএস (CSS) একটি প্রোগ্রামিং ভাষা যা এইচটিএমএল ডকুমেন্টকে সুদর্শনীয় করে তোলার জন্য ব্যবহৃত হয়। একটি এইচটিএমএল এলিমেন্টকে কিভাবে প্রদর্শন করানো হবে অথবা এলিমেন্টটির রং, সাইজ-আকৃতি, বড়-ছোট করা, পিছনের রং, অবস্থান, হেড লাইন, ভেতরের যায়গা, বাহিরের যায়গা, উচ্চতা-প্রস্থ, টেবিল _ ইত্যাদি তা সিএসএসের মাধ্যমে নির্ধারণ করে দেওয়া হয়।
সিএসএস কি ? (CSS): CSS এর পূর্ণরূপ হল (Cascading Style Sheets)। একটি ওয়েবসাইটের সকল HTML এলিনেমন্ট গুলকে স্টাইল-ডিজাইন-সুন্দর ও আকর্ষণীয় করে উপস্থাপন করায় CSS এর কাজ। এর কিছু নির্দিষ্ট কাজের নাম অথবা দিকনির্দেশনা আছে (যেগুলোকে Property বলা হয়) এবং এই প্রপার্টির কিছু নির্দিষ্ট কাজের ধরন আছে (যেগুলোকে Value বলা হয়)। যেমনঃ Property: Value ; উদাহরণঃ color: green; এখানে color হল property এবং green হল color এর value ।
“১৯৯৬ সালে World Wide Web Consortium (W3C) সিএসএস তৈরি করে।”
সিএসএস এর মূল উদ্দেশ্য হল একটি ওয়েব পেইজ কে সুন্দর ও আকর্ষণীয় করে তোলা। এইচটিএমএল আপনাকে আপনার ওয়েবসাইটের কাঠামো তৈরি করতে দেয় এবং সিএসএস সেই কাঠামোকে প্রাণবন্ত (জীবন্ত, সুন্দর, আকর্ষণীয়) করে তোলে।
CSS কোথায় ও কিভাবে লিখতে হবে?: এইচটিএমএল (HTML) কোড গুলো যেসব Code Editor (কোড ইডিটর) এ লেখা হয় ঠিক সেখানেই সিএসএস(CSS) Property and Value গুলো লিখা হয়। কিছু Code Editor যেমনঃ Notepad, Notepad++, Atom(by github), Sublime Text, Brackets . ইত্যাদি ব্যবহার করতে পারেন।
কিন্তু সিএসএস তিন ভাবে লেখা যায় যেমনঃ ১. Inline CSS বা (HTML ট্যাগ এর অভ্যন্তরীণ CSS) ২. Internal CSS বা (অভ্যন্তরীণ CSS) ৩. External CSS বা (বাহ্যিক CSS)
১. Inline CSS বা (HTML ট্যাগ এর অভ্যন্তরীণ CSS) কিঃ এইচটিএমএল এর নির্দিষ্ট এলিমেন্ট এর ট্যাগ এর ভিতরে (Hello Bangladesh)সিএসএস (CSS) Property: Value; লেখা হলে তাকে Inline CSS বা (HTML ট্যাগ এর অভ্যন্তরীণ CSS)বলে।
২. Internal CSS বা (অভ্যন্তরীণ CSS)কিঃ এইচটিএমএল এর নির্দিষ্ট এলিমেন্ট এর ট্যাগ এর ভিতরে (Hello Bangladesh) অথবা হ্যেড ট্যাগ () এর ভিতরে স্টাইল ট্যাগ এ() নির্দিষ্ট ট্যাগ কে (এর নাম, class or id) দারা টার্গেট করে সিএসএস (CSS) Property: Value; লেখা হলে তাকে Internal CSS বা (অভ্যন্তরীণ CSS)বলে।
উদাহরণঃ
(
.headLine{color:red;}
Hello Bangladesh)
৩. External CSS বা (বাহ্যিক CSS)কিঃ যেকোনো একটি এইচটিএমএল (HTML) ফাইল যেমনঃ index.html বা test.html ডিজাইন করার জন্য আলাদা ভাবে CSS ফাইল তৈরি করে (style.css) সেই ফাইল (CSS ফাইল) এর মধ্যে HTML এলিমেন্ট এর জন্য CSS Property: value; লিখা হলে তাকে External CSS বা (বাহ্যিক CSS) বলে ।
বিদ্রঃ এটির জন্য অবশ্যই HTML ফাইল এর সাথে CSS ফাইল লিঙ্ক করেতে হবে এবং HTML ও CSS ফাইল একই সাথে রাখতে হবে (একই ফোল্ডারে বা ফাইলে রাখতে হবে)।
লিঙ্ক করার পদ্ধতি
(
)
কিভাবে কি করতে হবে : CSS এর জন্য আলাদা ফাইল তৈরি করতে হলে .css এক্সটেনশন যেমন style.css বা test.css দ্বারা Save করে তার পর নির্দিষ্ট HTML ফাইল এর ট্যাগ এর মধ্যে ট্যাগ দারা CSS ফাইলটি লিঙ্ক করেতে হবে । তারপর CSS ফাইল টি নির্দিষ্ট code editor এ open করে CSS property: value; লিখতে হবে ।
CSS শিখতে হলে কিকি জানা আবশ্যক : 👇👇👇
• 1. CSS Property
• 2. CSS Value
• 3. CSS Linkup
• 4. CSS Class & Id
CSS Property কিঃ সিএসএস (CSS) দিয়ে এইচটিএমএল (HTML) ট্যাগ এর কি কাজ বা কি পরিবর্তন করা হবে তার বা কাজের মান কে CSS Property বলা হয়। কিছু CSS Property এর নাম যেমনঃ padding, margin, color, background, align, font, border, display, width, height, outline etc. এগুলো খুব বেশি ব্যবহার হয়ে থাকে।
CSS Value কিঃ সিএসএস (CSS) Property হল একটি কাজ বা কাজের নাম আর এই কাজটা কি ধরনের বা কি পরিমানে হবে তাই হলো CSS value উদাহরঃ color: green; এখানে color হল property এবং green হল color এর value। এই রকম প্রতিটা property এর ভিন্ন ভিন্ন value আছে।
CSS Linkup কিঃ External CSS লিখে কাজ করতে হলে এইচটিএমএল(HTML) ফাইল এর সাথে সিএসএস(CSS) ফাইল সংযুক্ত করাকে বুঝাই।
CSS Class & Id কিঃ এইচটিএমএল(HTML) এ থাকা একই নামের একাধিক ট্যাগ থেকে যেকোনো একটি ট্যাগ কে টার্গেট করার জন্য CSS class ও id ব্যবহার করা হয়।
উদাহরণঃ Hello Bangladesh
Hello Bangladesh People
CSS ফাইলে class কে টার্গেট করার জন্য . দিয়ে class name টা লিখতে হয় যেমনঃ .headline{color: red;}
CSS ফাইলে id কে টার্গেট করার জন্য # দিয়ে id name টা লিখতে হয় যেমনঃ {color: green;}
এগুলাই CSS এর মৌলিক ধারনা ।
আশা করি আপনি CSS সম্পর্কে মৌলিক ধারনা পেয়েছেন।
Share your videos with friends, family, and the world
