এইচটিএমএল ব্যাকগ্রাউন্ড রং টিউটোরিয়াল (HTML Background Colors Tutorial in Bangla)

0
85
html
html

এইচটিএমএল ব্যাকগ্রাউন্ড রং টিউটোরিয়াল (HTML Background Colors Tutorial in Bangla)

bgcolor এট্রিবিউট টি বিশেষভাবে ওয়েব পেজ এবং টেবিলের ব্যাকগ্রাউন্ড নিয়ন্ত্রন করে। Bgcolor এট্রিবিউট টিকে অনেক এইচটিএমএল ট্যাগ এর মধ্যে ব্যাবহার করা যায় তবে সবচেয়ে ভাল হয় <body> এবং <table> ট্যাগ এর মধ্যে ব্যাবহার করলে। অতিরিক্ত হিসাবে ব্যাকগ্রাউন্ড স্টাইল করতে চাইলে সিএসএস ব্যাকগ্রাউন্ড(CSS টিউটোরিয়ালে আরোচনা করা হয়েছে) দেখতে পারেন।

গঠন:

<tagname bgcolor =”value”>

1.<body bgcolor="Silver">
2.<p>We set the background of this paragraph to be silver. The body tag is
3.where you change the pages background. Now continue the lesson to
4.learn more about adding background colors in your HTML!
5.</p>
6.</body>

প্রদর্শন:

We set the background of this paragraph to be silver. The body tag is where you change the pages background. Now continue the lesson to learn more about adding background colors in your HTML!

টেবিলের ব্যাকগ্রাউন্ডএ কালার যোগ করা :

01.<table bgcolor="lime" border="1"><tr>
02.<td>A lime colored table background using color names.</td>
03.</tr></table>
04.
05.
06.<table bgcolor="#ff0000" border="1"><tr>
07.<td>A red colored table background using hexadecimal values "#FF0000".</td>
08.</tr></table>
09.
10.
11.<table bgcolor="rgb(0, 0, 255)" border="1"><tr>
12.<td>A blue colored table background using RGB values "rgb(0, 0, 255)".</td>
13.</tr></table>

প্রদর্শন:

A lime colored table background using color names.
A red colored table background using hexadecimal values “#FF0000”.
A blue colored table background using RGB values “rgb(0, 0, 255)”.

টেবিলের সারি এবং কলামে কালার যোগ করা:

1.<table>
2.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>
3.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>
4.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>
5.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>
6.<tr bgcolor="#FFFF00"><td>This Row is Yellow!</td></tr>
7.<tr bgcolor="#AAAAAA"><td>This Row is Gray!</td></tr>
8.</table>

প্রদর্শন:

This Row is Yellow!
This Row is Gray!
This Row is Yellow!
This Row is Gray!
This Row is Yellow!
This Row is Gray!

একত্রে ব্যাকগ্রাউন্ড color এবং font color:

1.<table bgcolor="#000000">
2.<tr><td bgcolor="#009900">
3.<font color="#FFFF00" align="right">Green Bay</font></td>
4.<td><font color="#FFFFFF">13</font></td></tr>
5.<tr><td bgcolor="#0000FF">
6.<font color="#DDDDDD" align="right">New England</font></td>
7.<td><font color="#FFFFFF">27</font></td></tr>
8.</table>

প্রদর্শন:

Green Bay 13
New England 27
1.<table bgcolor="#777777">
2.<tr><td>
3.<p><font face="Monotype Corsiva, Verdana" size="4" color="#00FF00">
4.This paragraph tag has...
5.</font></p>
6.</td></tr>
7.</table>

প্রদর্শন:

This paragraph tag has a gray background with green colored font. You should see Monotype Corsiva font if you have it installed, or Verdana as the backup. Both fonts are widely accepted as standard fonts.

এইচটিএমএল ব্যাকগ্রাউন্ড টিউটোরিয়াল (HTML Background Tutorial in Bangla)

ব্যাকগ্রাউন্ড এট্রিবিউট এর সাহায্যে এইচটিএমএল টেবিলে ইমেজকে ব্যাকগ্রাউন্ড ইমেজ হিসাবে দেখানো যায়।

1.<table height="50" width="100"
2.background="http://www.webcoachbd.com/images/stories/imagel.jpg" >
3.<tr><td>This table has a background  image</td></tr>
4.</table>

প্রদর্শন:

This table has a background image

এইচটিএমএল ব্যাকগ্রাউন্ড রিপিট:

উপরের উদাহরনে দেখা গিয়েছে যে টেবিল এর আকার ছবির আকারের সমান বলে কোন সমস্যা হয় নি । যদি টেবিল এর আকার ছবির আকারের চেয়ে বড় হয় তবে ব্যাকগ্রাউন্ড ছবি রিপিট হবে।

1.<table height="200" width="300"
2.background="http://www.webcoachbd.com/images/stories/imagel.jpg" >
3.<tr><td>This table has a background  image</td></tr>
4.</table>

প্রদর্শন:

This table has a background image

এইচটিএমএল প্যাটার্নড ব্যাকগ্রাউন্ড

বিভিন্ন ফটো এডিটিং সফ্টওয়ার দিয়ে বিভিন্ন প্যাটার্নের ব্যাকগ্রাউন্ড ছবি এরং ট্রান্সপারেন্ট ব্যাকগ্রাউন্ড ছবি তৈরী করা যায়। ট্রান্সপারেন্ট ইমেজের ফাইলটিকে gif ফরমেটে রাখতে হবে jpeg ফরমেটে নয়।

1.<table height="100" width="150"
2.background="http://www.tizag.com/pics/htmlT/pattern.jpg" >
3.<tr><td>This table has a background patterned  image</td></tr>
4.</table>

প্রদর্শন:

This table has a background patterned image
1.<table  background="http://www.tizag.com/pics/htmlT/transparent.gif" >
2.<tr><td>This table has a red transparent background  image</td></tr>
3.</table>

প্রদর্শন:

This table has a red transparent background image

এইচটিএমএল ফ্রেম টিউটোরিয়াল (HTML Frame)

ফ্রেম এর মাধ্যমে একই সময় একই ব্রাউজার উইন্ডো তে অনেক গুলো এইচটিএমএল ডকুমেন্ট প্রদর্শন করা যায়।

LEAVE A REPLY

Please enter your comment!
Please enter your name here