This is lesson 5 where we cover Classes, Divs & Spans. I don't really know what they do but I am going to try them anyway. Classes allow you to change the style of the page. The class attributes are defined in the style section and then used in the body. I'm not very creative with all of this stuff yet so I am going to use some of the ones in the book, just to test them out and see the difference in what they do. The names of the classes can be anything I want as long as I know what they mean. If other people are working on my site, they need to know what I mean also.
Next I will use a note. I suppose since I am copying from the book, I can emphasise some text using red, my favorite color. I actually should be taking a nap right now but I get so hooked on these lessons that it's hard for me to put them down. In the lesson the instructor also made the red text a little larger and aligned the text left instead of justified like her other text.
The div tag is completely unclear to me. The lessons say they divide the page into sections like color, italics, bold or centered. We will see how this comes out when I try them. Span is the same in functionality as div except ist is used for smaller units like a word, phrase, sentence or a single letter. I probably need to add more text to these paragraphs but I don't know what to write so I will use a little lorem ipsum.
Another class is center. It can be used to center text and images. I think I will center an image below this paragraph along with the text. I will also use the span code that doubles the size of the font and hopefully changes the font and background colors. Oh cool, that worked.
Part 2 of the lessons covers tables. Tables are not for images. (The previous sentence will be strong & orange) They are only for text and data. A table is basically just a bunch of rows that mush together automatically like the one below.
| Test heading | ||
|---|---|---|
| This is row one column one | This is row one column two | This is row one column three |
| This is row two column one | This is row two column two | This is row two column three |
Last but not least will be thumbnail images. I will put one below to link to a larger copy of the same image.
This paragraph is for testing out the special formatting. According to the lessons, the code tag formats all of the text enclosed to a monotype font which makes it easier to see the difference between that text and the regular text in the rest of the page.
This paragraph is for testing out the special formatting. According to the lessons, the pre tag was used when the teacher showed us the samples of CSS Coding. It is an abbreviation for "pre-formatted". She defined a class for "pre" tags. If she hadn't done it that way all of the text would appear exactly as typed. This tag also allows the keyboard spacebar and enter key to add extra spaces and line breaks.
Here is a sample using the pre tag.
Let's just see if this works for adding spaces and line breaksWell it looks like it worked.