Tag Archives: alignment

এইচটিএমএল এর স্টাইল (HTML Styles)

Huge Sell on Popular Electronics

এইচটিএমএল এর স্টাইল (HTML Styles)

নাম-শরিফুল ইসলাম
Job category-PHP Coder
Email-bappiislam1988@gmail.com
Mob-01722806467
বিষয়- HTML Styles

এইচটিএমএল স্টাইল

প্রত্যেকটি এইচটিএমএল উপাদানের জন্য একটি ডিফল্ট বা নির্দিষ্ট স্টাইল থাকে পিছনের কালার বা ব্যাকগ্রাউন্ড কালার সাদা এবং টেক্সট এর কালার কালো। স্টাইল attribute এর মাধ্যমে আমরা এই ডিফল্ট কালার কে পরিবর্তন করতে পারি। নিচের উদাহরণ এ ব্যাকগ্রাউন্ড কালার ডিফল্ট সাদা থেকে light gray কালার এ পরিবর্তনকরা হয়েছে।

উদাহরণ


<!DOCTYPE html>
<html>
<body style="background-color:lightgrey">

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>
</html>


 

This is a heading

This is a paragraph.

Bgcolor attribute পুরাতন এইচটিএমএল ভার্সন এ সাপোর্ট করে কিন্তু এইচটিএমএল ৫ এ সাপোর্ট করে না

এইচটিএমএল স্টাইল attribute

এইচটিএমএল স্টাইল attribute নিম্নোক্ত syntax মেনে চলে


style="property:value"


এই প্রপার্টি হল সিএসএস এর প্রপার্টি এবং ভ্যালু হল সিএসএস এর ভ্যালু।

 

এইচটিএমএল টেক্সট কালার

এইচটিএমএল এর টেক্সট কালার পরিবর্তন করার জন্য color প্রপার্টি ব্যবহার করা হয়।
উদাহরণ


<body>
<h1 style="color:blue">This is a heading
<p style="color:red">This is a paragraph.</p>
</body>


 

ফলাফল


This is a heading

This is a paragraph.


 

এইচটিএমএল ফন্টস

Font-family প্রপার্টি দ্বারা ফন্টের ধরন পরিবর্তন করা হয়।
উদাহরণ


<body>
<h1 style="font-family:verdana">This is a heading</h1>
<p style="font-family:courier">This is a paragraph.</p>
</body>


 

 

ফলাফল


This is a heading

This is a paragraph.


পুরাতন এইচটিএমএল এ <font> ট্যাগ সাপোর্ট করে কিন্তু এইচটিএমএল ৫ এ সাপোর্ট করে না।

 

এইচটিএমএল টেক্সট সাইজ

Font-size প্রপার্টি দ্বারা টেক্সট এর আকার পরিবর্তন করা হয়।
উদাহরণ


<body>
<h1 style="font-size:300%">This is a heading</h1>
<p style="font-size:160%">This is a paragraph.</p>
</body>


 

ফলাফল


This is a heading

This is a paragraph.


 

এইচটিএমএল টেক্সট alignment

Text-align প্রপার্টি দ্বারা টেক্সট horizontal ভাবে কোন দিকে অবস্থান করবে তা নির্দেশ দেওয়া হয়
উদাহরণ


<body>
<h1 style="text-align:center">Centered Heading</h1>
<p>This is a paragraph.</p>
</body>


 

 

ফলাফল


 

Centered Heading

This is a paragraph.


 

<center> ট্যাগ পুরাতন এইচটিএমএল ভার্সন এ কাজ করে নতুন এইচটিএমএল এ কাজ করে না।

 

একনজরে প্রপার্টি গুলো

• স্টাইল attribute এর ব্যবহার

• background-color এর ব্যবহার

• color এর সাহায্যে টেক্সট কালার এর ব্যবহার

• টেক্সট এর ফন্ট এর জন্য font-family এর ব্যবহার

• টেক্সট এর আকার এর জন্য font-size এর ব্যবহার

এবং

• text-align এর ব্যবহার।

লেকচার ২৩: মাইক্রোসফট ওয়ার্ড 2010 – টেক্সট প্রান্তিক বিন্যাস (Word 2010 – Text Alignment)

Huge Sell on Popular Electronics