আগে থেকেই আপনার যা জানা উচিত
CSS শেখা শুরু করার আগে আপনার HTML/XHTML সম্পর্কে সাধারণ ধারণা থাকা উচিত।
CSS কি
* CSS বলতে বুঝায় ক্যাসকেডিং স্টাইল শিটস (Cascading Style Sheets)
* এই স্টাইল নির্ধারণ করে HTML উপাদানগুলো কেমনভাবে প্রদর্শিত হবে
* HTML 4.0 ভার্সনের সঙ্গে স্টাইল যোগ করা হয়েছিল একটি সমস্যা সমাধানের উপায় হিসেবে
* স্টাইল শিট বাড়তি পরিশ্রমের হাত থেকে রক্ষা করে
* CSS ফাইলের মধ্যে গোটা স্টাইলশিট সংরক্ষণ করা থাকে

স্টাইল একটি বড় সমস্যা সমাধান করেছিল
ডকুমেন্ট ফরম্যাটিং বা সজ্জার কাজে HTML এর সাথে কখনো ট্যাগ ব্যবহার করার পরিকল্পনা ছিল না। HTML কেবল ডকুমেন্টের বিষয়বস্তুকে নির্দেশ করার জন্য ব্যবহারের কথা ছিল। যেমন:

এটি একটি শিরোনাম

এটি একটি প্যারাগ্র্যাফ

HTML 3.2 ভার্সনের সাথে যখন বিভিন্ন রকম ট্যাগ যেমন কিংবা color উপাদানগুলো ব্যবহার শুরু হলো, তখন ওয়েব ডেভলপারদের জন্য তা একপ্রকার দু:স্বপ্নে পরিণত হলো। বড় বড় ওয়েবসাইটের প্রতিটি পৃষ্ঠায় font এবং color উপাদানগুলো ব্যবহার করা অনেক কষ্টদায়ক ও সময়সাপেক্ষ হয়ে উঠল।
আর এই সমস্যা সমাধানের লক্ষ্যে ওয়ার্ল্ড ওয়াইড ওয়েব কনসোর্টিয়াম (W3C) প্রণয়ন করে CSS.
HTML 4.0 ভার্সন থেকেই সকল HTML ডকুমেন্ট থেকে পৃথক ফরম্যাটিং বাদ দেয়া সম্ভব হল। পরিবর্তে একটি আলাদা CSS ফাইলে ফরম্যাটিং নির্দেশনা সংরক্ষণের ব্যবস্থা করা হলো।
--------------------------------------------------------------------------------

CSS বাক্যরীতি (Syntax)

একটি CSS সেট একটি সিলেক্টর (selector) এবং একটি ডিক্লেয়ারেশন (declaration) ব্লক দ্বারা গঠিত:

CSS সিলেক্টর
সিলেক্টর নির্দেশ করে দেয় আপনি HTML উপাদানগুলোকে কিভাবে সাজাবেন।
ডিক্লেয়ারেশন ব্লকে এক কিংবা একাধিক ডিক্লেয়ারেশন সেমিকোলন দ্বারা পৃথক করা হয়। প্রতিটি ডিক্লেয়ারেশনে একটি প্রোপার্টির (property) নাম এবং তার মান (value) কোলন (:) দ্বারা আলাদা করা থাকে।

CSS উদাহরণ
একটি CSS ডিক্লেয়ারেশন সবসময় সেমিকোলনের মাধ্যমে শেষ হয়। ডিক্লেয়ারেশন গ্রুপটি দ্বিতীয় বন্ধনী "{}" দ্বারা ঘেরা থাকে। যেমন:
p {color:red;text-align:center;}

তবে CSS কোডকে সহজে পঠন ও উপলব্ধির জন্য ডিক্লেয়ারেশনগুলো আলাদা লাইনে দেয়া যেতে পারে:
যেমন

p {
color: red;
text-align: center;
}