HTML Styles
HTML Styles (স্টাইল)
HTML Styles ব্যবহারের মাধ্যমে আমরা ওয়েব পৃষ্ঠার উপাদানগুলোর (elements) রঙ, ফন্ট, আকার, ব্যাকগ্রাউন্ড ইত্যাদি পরিবর্তন করতে পারি। সাধারণত স্টাইল style এট্রিবিউটের মাধ্যমে নির্ধারণ করা হয়।
📘 সিনট্যাক্স:
<tagname style="property:value;">বিষয়বস্তু</tagname>
এখানে property মানে CSS প্রপার্টি এবং value মানে সেই প্রপার্টির মান।
🎨 উদাহরণ:
<p style="color:blue;">এই টেক্সটটি নীল রঙের।</p> <p style="font-size:20px;">এই টেক্সটের আকার বড়।</p> <p style="background-color:yellow;">এই টেক্সটের ব্যাকগ্রাউন্ড হলুদ।</p> <p style="text-align:center;">এই টেক্সটটি মাঝখানে রয়েছে।</p>
🧩 ব্রাউজারে প্রদর্শন:
এই টেক্সটটি নীল রঙের।
এই টেক্সটের আকার বড়।
এই টেক্সটের ব্যাকগ্রাউন্ড হলুদ।
এই টেক্সটটি মাঝখানে রয়েছে।
🎯 জনপ্রিয় CSS প্রপার্টি:
| CSS প্রপার্টি | কাজ | উদাহরণ |
|---|---|---|
| color | টেক্সটের রঙ পরিবর্তন করে | color:red; |
| background-color | ব্যাকগ্রাউন্ডের রঙ পরিবর্তন করে | background-color:lightgray; |
| font-size | ফন্টের আকার পরিবর্তন করে | font-size:18px; |
| text-align | টেক্সটের অবস্থান নির্ধারণ করে (left, right, center) | text-align:center; |
| font-family | ফন্ট পরিবর্তন করে | font-family:'Arial'; |
💡 ইনলাইন, ইন্টারনাল ও এক্সটারনাল স্টাইল:
- Inline CSS:
styleএট্রিবিউটের মাধ্যমে ট্যাগে লেখা হয়। - Internal CSS:
<style>ট্যাগের মধ্যে<head>অংশে লেখা হয়। - External CSS: আলাদা CSS ফাইল ব্যবহার করে
<link>ট্যাগের মাধ্যমে যুক্ত করা হয়।
🧠 অনুশীলন:
একটি প্যারাগ্রাফ লিখুন যার রঙ হবে সবুজ, ব্যাকগ্রাউন্ড হবে হালকা হলুদ, এবং ফন্ট সাইজ হবে 18px।