To add color you would add the following HTML code into the body of your text file.
<body bgcolor = "#0000FF">
Notice how instead of saying We have used some strange looking code. Dont worry this is called "Hexadecimal colour" and can be used for inserting complex colours into your website.Check out some more Hexadecimal values below,
Hex values are written as 3 double digit numbers, starting with a # sign.
| Color | Color HEX | Color RGB |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #FF0000 | rgb(255,0,0) | |
| #00FF00 | rgb(0,255,0) | |
| #0000FF | rgb(0,0,255) | |
| #FFFF00 | rgb(255,255,0) | |
| #00FFFF | rgb(0,255,255) | |
| #FF00FF | rgb(255,0,255) | |
| #C0C0C0 | rgb(192,192,192) | |
| #FFFFFF | rgb(255,255,255) |
16 Million Different Colors
The combination of Red, Green and Blue values from 0 to 255 gives a total of more than 16 million different colors to play with (256 x 256 x 256). Most modern monitors are capable of displaying at least 16384 different colors. If you look at the color table below, you will see the result of varying the red light from 0 to 255, while keeping the green and blue light at zero.
Shades of Gray
Gray colors are displayed using an equal amount of power to all of the light sources. To make it easier for you to select the right gray color we have compiled a table of gray shades for you:
| RGB(0,0,0) | #000000 | |
| RGB(8,8,8) | #080808 | |
| RGB(16,16,16) | #101010 | |
| RGB(24,24,24) | #181818 | |
| RGB(32,32,32) | #202020 | |
| RGB(40,40,40) | #282828 | |
| RGB(48,48,48) | #303030 | |
| RGB(56,56,56) | #383838 | |
| RGB(64,64,64) | #404040 | |
| RGB(72,72,72) | #484848 | |
| RGB(80,80,80) | #505050 | |
| RGB(88,88,88) | #585858 | |
| RGB(96,96,96) | #606060 | |
| RGB(104,104,104) | #686868 | |
| RGB(112,112,112) | #707070 | |
| RGB(120,120,120) | #787878 | |
| RGB(128,128,128) | #808080 | |
| RGB(136,136,136) | #888888 | |
| RGB(144,144,144) | #909090 | |
| RGB(152,152,152) | #989898 | |
| RGB(160,160,160) | #A0A0A0 | |
| RGB(168,168,168) | #A8A8A8 | |
| RGB(176,176,176) | #B0B0B0 | |
| RGB(184,184,184) | #B8B8B8 | |
| RGB(192,192,192) | #C0C0C0 | |
| RGB(200,200,200) | #C8C8C8 | |
| RGB(208,208,208) | #D0D0D0 | |
| RGB(216,216,216) | #D8D8D8 | |
| RGB(224,224,224) | #E0E0E0 | |
| RGB(232,232,232) | #E8E8E8 | |
| RGB(240,240,240) | #F0F0F0 | |
| RGB(248,248,248) | #F8F8F8 | |
| RGB(255,255,255) | #FFFFFF |
If you are finding all of these different colour codes confusing dont worry!
As well as using the Hexadecimal method, you can also use good old fasioned English! Meaning that placing the following code into your HTML file would have the exact same effect:
<body bgcolor = "blue">
When inserted into your code, the code should look like this:
<html>
<head>
<title>My Own Home Page </title>
</head>
<body>
<body bgcolor= "blue">
<H1> I am Your-Name and this is my web Page!</H1>
</body>
Test your file by saving it, remember to save it as "index.html" and make sure you slect "All Files" from the save as type box. Now that we have our background colour sorted out, we can now alter the text colour. We go about doing this in the same way. This is the code we need to insert into our webpage:
<font color="Red">Text that you want to make red goes here</font>
Notice that you must put </font> after the text has ended. If you didnt insert the </font> then your entire document would have the text as red. This isnt to important for now but if you ever have more than one text colour on a page this may become a problem. Here is how your code should now look:
<html>
<head>
<title>My Own Home Page </title>
</head>
<body>
<body bgcolor= "blue">
<font color="Red">
<H1> I am Your-Name and this is my web Page!</H1>
</font>
</body>
Note:
A common error when coding with colours and HTML in general are simple spelling mistakes.
Remember that when typing "color" it is the american spelling, make sure you dont use the english spelling "colour" or your HTML wont work.
Hi, I'm Moinuddin. I'm a Software Engineer at WIPRO working on Microsoft .NET Technology. I'm interested in a wide range of technology topics, mainly Microsoft including Windows Azure, WCF, WPF, Silverlight and any other cool technology that catches the eye.
0 comments:
Post a Comment