HTML Colors & Backgrounds

Backgrounds are nothing but it’s either an image or some colors.


BG color <bgcolor>

This attribute specifies the background color for a particular HTML page.

It can be defined either in three ways. They are

  • By hexadecimal number,
  • By RGB value,
  • By color name

Eg:   Hexadecimal number<body bgcolor=”#FFFF00 “>
RGB value <body bgcolor=”rgb(255,255,0)”>

Color name<body bgcolor=”yellow”>

Note:
Colors which are defined using a hexadecimal notation should concerned with combinations of red, green, and blue (RGB).

The lowest value is 0 andthe highest value is 255

Inside the <body> tag we can specify colors for different links, fonts etc. Links such as active links(alink), visited link(vlink) carries different colors.

 

Some of the colors which are frequently used in HTML is given below:

 

Hex Codes RGB Values Color Names Color
#000000 rgb(0,0,0) Black
 
#FF0000 rgb(255,0,0) Red
 
#00FF00 rgb(0,255,0) Green
 
#0000FF rgb(0,0,255) Blue
 
#FFFF00 rgb(255,255,0) Yellow
 
#00FFFF rgb(0,255,255) Aqua
 
#FF00FF rgb(255,0,255) Fuchsia
 
#C0C0C0 rgb(192,192,192) Gray
 
#FFFFFF rgb(255,255,255) White
 

 

 

BG Image

Instead of colors we can provide background image for our HTML page.

It is depend upon two values of URL attribute.

They are

  • Relative

 

Example :


<body background="pt.gif">

  • Absolute

Example :


<body background="http://programmingtute.com/html/pt.gif">

Note: If the selected image is smaller than the browser window, then the image will get repeated itself until it fills the entire browser window.

If you want to display an image on a page (not as background), you need to use the imgsrc attribute i.e. image source.

Src contains the value of the URL of the image that you want to display on the page.

 

For example:


<imgsrc="http://www.programmingtute.com/html/pt.gif" >

Inside this we can use different attributes such as alternate name (alt), width, height etc.

Example:


<img src="pt.gif" alt="Programming Tute" width="36" height="46">

 

Posted on July 12, 2014 in HTML

Share the Story

Leave a reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Back to Top