স্টাইলশীট HTML-এ একটি ডকুমেন্ট স্ক্রিনে কীভাবে প্রদর্শিত হবে তা বর্ণনা করতে ব্যবহৃত হয়। CSS-এ সহজে একটি HTML এলিমেন্টের জন্য অনেক স্টাইল প্রোপার্টি নির্দিষ্ট করা যায়। প্রতিটি প্রোপার্টির একটি নাম এবং একটি ভ্যালু থাকে, যা কোলন (:) দিয়ে পৃথক করা হয়।
আপনি আপনার HTML ডকুমেন্টে তিনটি উপায়ে CSS ব্যবহার করতে পারেন:
- এক্সটার্নাল স্টাইল শীট (External Style Sheet) − স্টাইল শীট রুলস একটি আলাদা .css ফাইলে ডিফাইন করুন এবং তারপর HTML
<link>ট্যাগ ব্যবহার করে সেই ফাইলটি আপনার HTML ডকুমেন্টে ইনক্লуд করুন। - ইন্টারন্যাল স্টাইল শীট (Internal Style Sheet) − HTML ডকুমেন্টের হেডার সেকশনে
<style>ট্যাগ ব্যবহার করে স্টাইল শীট রুলস ডিফাইন করুন। - ইনলাইন স্টাইল শীট (Inline Style Sheet) − HTML এলিমেন্টসের সাথে সরাসরি style অ্যাট্রিবিউট ব্যবহার করে স্টাইল শীট রুলস ডিফাইন করুন।
মনে রাখবেন প্রতিটি প্রোপার্টি ডিক্লেরেশন সেমিকোলন (;) দিয়ে পৃথক করা হয়। HTML এলিমেন্টস এবং অ্যাট্রিবিউটে CSS যোগ করতে style অ্যাট্রিবিউট ব্যবহার করুন। এভাবেই আপনি ইনলাইন স্টাইলশীট যোগ করে টেক্সট রঙ সেট করতে পারেন:
উদাহরণ
নিচের কোড চালিয়ে দেখুন HTML পেজে স্টাইলশীট যোগ করতে:
<!DOCTYPE html> <html> <head> <title>HTML style sheet</title> </head> <body> <h1 style="color:red"> Heading </h1> <p style="color:blue"> This is demo text </p> </body> </html>
আউটপুট
