Day Three - Text and a Brief (But Thorough!) Overview of Color
Today: Two HTML tags for breaking up text, and an attribute for the <body> tag.
Open up index.html in Notepad. Place your cursor right between the <body> tag and the end carrot. Place a space, and then type text="#000000".
This attribute tells the browser that you are specifying a color for the text. All text (unless otherwise specified, but we’ll get to this much later) will be colored black. How on earth, you ask, do numbers spell out ‘black’? Enter the hexidecimal number system.
If you wish to skip the explaination of hex code, just skip this box...
|
Hexidecimal, or hex for short, is a way of counting, just the same as the decimal system, which is much more familiar to us. We use 10 integers, 0-9, to count. Hexidecimal uses 16: 0-9, then a, b, c, d, e, f. At this point, they start doubling up, the same way we place '1' in front of '0' for '10', then '1' in front of '1' for '11', etc. Hex goes 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f, 10, 11... 19, 1a, 1b, 1c, 1d, 1e, 1f, 20.... 29, 2a, 2b, etc. In this way, hex can count up to our 255 before requiring a third place value. Which is convenient, because binary, the counting system computers think in, goes to 256. When you add in the 0 value in hex, there are 256 two-digit values between 0 and 255. Now why is ^that^ important? Color values. All computers capable of color display this color in combinations of red, green, and blue. (This is similar to the conventional red, yellow, and blue color wheels we are all taught in seventh grade, but slightly different. For more information, research ‘Additive versus Subtractive Color Properties’.) The color yellow is actually a combination of red and green. Purple is red plus blue. Internet browsers are taught to take all of the red, green, and blue into account when creating a color. This is called ‘RGB’. Now, each R value can range from 0 to 255; same for each G and B value. But each of these decimal values has an equvalent in hex. Let’s take a bright red, the brightest the computer screen will produce. The R value is 255, G is 0, and B is 0. In RGB terms, this is 255-0-0. In hex terms, this is FF-00-00. Browsers, however, can read this without the dashes in: FF0000. So, the color red is understood by browsers to be FF0000. Four paragraphs up, I said to place the ‘text="#000000"’ in the body tag. All those zeros in the argument mean that there is no red, no green, and no blue value for the text -- in otherwords, black. Conversely, ‘ffffff’ means 255-255-255, or, white. The # sign just means to the browser, ‘I’m about to read a hex color code.’ FAQ: ‘You wrote the code for white once in all caps, and once in all lowercase. Does it matter?’ Answer: No. Hex code is case-insensitive. Some people like it large, some people like it small. Some people like it nine days old. (Okay, bad joke.) It’s up to you. Side note: While much of HTML is case-insensitive, many other programming languages, such as Perl, are not. Don’t get too used to seeing things one way or another. On the other hand, unless you are (or will become) a hard-core programmer who demands to handle every piece of code yourself, it’s unlikely you’ll deal with Perl or most any other such language anytime in the next five or eight years. |