Using
Colors
When
I talked about colors previously (fonts,
background colors),
I always used the name of the color to specify it. This
works for some common colors such black or white, because
black is black and white is white. What is blue? You
might think of one shade of blue as blue and your friend
might think of another. Browsers are the same way. What
Internet Explorer thinks of as blue might be very different
than what Netscape Navigator does, and different versions
of the same browser may look different.
There
is a way around this problem. The solution is to state
the color specifically using a number rather than a name.
We use Hexadecimal numbers to indicate color values.
If you want more on what hexadecimals
are, then scroll down to the bottom of this page to find
out.
In
the RGB (Red, Green, Blue) color scale, each color has
a value of from 0 to 255. How many different possible
color combinations does that make? If you do the math:
255x255x255=16,581,375
This
means that we have over 16.5 million different possible
color combinations. Of course, the human eye cannot distinguish
that many, but they exist.
On
the web, instead of using RGB, we use hexadecimal values.
In hexadecimal, 255=FF (see my section on hexadecimals
if you don't believe me!). So, we have a possible of
00-FF for each: red, green, and blue. Therefore, we write
the code for colors like this:
<body
bgcolor="#000000">
<font
color="#A3cdFF">
You
need to have the quotation marks and you need to have
the "#" symbol. By the way, what color is "#000000"?
Well, it is black, or the absence of all color. White
would be the combination of all color or "#FFFFFF".
|
Color
|
Hexadecimal
|
|
Black
|
000000
|
|
White
|
FFFFFF
|
|
Blue
|
0000FF
|
|
Green
|
00FF00
|
|
Red
|
FF0000
|
|
Gray
|
999999
|
|
Light
Gray
|
CCCCCC
|
Using
hexadecimal numbers, you can control the exact look of
the colors on your page. Well, almost. Two more problems
exist. The first is that not everybody has their monitors
set the same, so different monitors use different colors.
The second problem is that some people use PCs and some
use Macs. Even though the colors may be the same, they
look different on a Mac (Macs tend to make colors more
subtle) than on a PC.
Good
luck!
Go
on to the next page.
Hexadecimal
Numbers
Our
numbering system, decimal, uses a base of 10. So, when
you say a number, for example, 125, what you are saying
is this:
|
102
(10x10)
|
101
(10x1)
|
100
|
|
=100
|
=10
|
=1
|
|
1
|
2
|
5
|
Take
one 102 (which equals 100), take two 101
(which equals 20) and take five 100. What
you get is 125. That's easy enough.
Binary
numbers work the same way, but instead of being base
10, they are base two.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
So,
if we have a decimal number of 275, what is the binary?
Remember, with binary you can only use 0 and 1. Start
with the largest possible number.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
| |
|
|
|
|
|
|
|
|
|
275
is bigger than 256 but smaller than 512, so we start
with 256 and take 1.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
| |
1
|
|
|
|
|
|
|
|
|
We
subtract 256 from 275 and are left with 19. So, 128 is
too big, 64 is too big, 32 is too big, but 16 is not.
Put 0s in all of those except 16.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
|
|
1
|
0
|
0
|
0
|
1
|
|
|
|
|
We
subtract 16 from 19 and we are left with 3. So, 8 is
too big and 4 is too big. Put 0s there.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
|
|
1
|
0
|
0
|
0
|
1
|
0
|
0
|
|
|
Following
the same logic, we subtract 2 from 3 and get 1. So, we
need 1 21 and 1 20.
|
29
|
28
|
27
|
26
|
25
|
24
|
23
|
22
|
21
|
20
|
|
=512
|
=256
|
=128
|
=64
|
=32
|
=16
|
=8
|
=4
|
=2
|
=1
|
|
|
1
|
0
|
0
|
0
|
1
|
0
|
0
|
1
|
1
|
So,
our binary of 275 is: 100010011.
Hexadecimal
works exactly the same, but the table looks like this:
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
|
|
|
The
numbers get really big quickly.
We
have another problem as well. How do you represent numbers
11-15? We only have 10 digits, 0-9. The answer is to
use letters.
|
Decimal
|
|
Hexadecimal
|
|
0
|
=
|
0
|
|
1
|
=
|
1
|
|
2
|
=
|
2
|
|
3
|
=
|
3
|
|
4
|
=
|
4
|
|
5
|
=
|
5
|
|
6
|
=
|
6
|
|
7
|
=
|
7
|
|
8
|
=
|
8
|
|
9
|
=
|
9
|
|
10
|
=
|
A
|
|
11
|
=
|
B
|
|
12
|
=
|
C
|
|
13
|
=
|
D
|
|
14
|
=
|
E
|
|
15
|
=
|
F
|
Let's
try an example. What would be the hexadecimal of the
decimal 687?
687
is bigger than 256 but smaller than 4096, so we need
162. However, we need more than just one 162.
How many? Two because 256+256=512.
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
2
|
|
|
Now
we need to subtract 512 from the original 687. That leaves
us with 175. How many times does 16 go into 175? It can
go 10 times (10x16=160). Remember, we show the number
10 with an "A" in hexadecimal.
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
2
|
A
|
|
Subtract
160 from 175 and we are left with 15. How many 1s in
15? Fifteen, which is represented by the letter F.
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
2
|
A
|
F
|
So,
our hexadecimal value of 687 is: 2AF
What
is the Hexadecimal of 255? Use the same process. 255
is too small for 256. How many times will 16 go into
255? The answer is 15. In hex, 15 is represented with
F.
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
|
F
|
|
15x16=240,
so we have 15 left over. One goes into 15 fifteen times.
15=F
|
163
|
163
|
162
|
161
|
160
|
|
=65536
|
=4096
|
=256
|
=16
|
=1
|
|
|
|
|
F
|
F
|
Therefore,
the highest value of Red=FF, the highest value of Green=FF
and the highest value of Blue=FF. The lowest for each
would be nothing or 00.
That's
all there is to hexadecimal.
Go
on to the next page.