PDA

View Full Version : CSS Tutorial #1 & Tutorial #2 Examples



FPRob
09-28-2006, 05:05 PM
In CSS Tutorial #1 you saw how to create a style sheet and the formatting of CSS instructions.

In CSS Tutorial #2 you saw many of the properties available to you when it comes to styling certain page elements.

Here are some examples of CSS coding that I have used in my sites. There are no actual explanations listed here as to what these instructions do but...

Using the first two tutorials will help you decipher these commands for yourself which is the single best way to learn programming. Take a look at these commands and the way they are layed out and then refer back to the other two tutorials and try to create some of your own CSS commands in a reply here. This will help you learn more effectively than simply being supplied with all the answers.

The instructions below have been colour coded as per the examples in the first two tutorials.


P {font-family: Verdana; line-height: 12px; font-size: 10px; text-align:justify; margin: 15px; margin-top: 2px; color: #000000}

H1 {font-family: Arial; line-height: 15px; font-size: 14px; letter-spacing: 3px; font-weight: bold; margin: 15px; margin-bottom: 2px; text-align: left; color: #333}


Here is one that you havent seen yet. Image formatting. Notice how the border commands have all been issued in one single statement rather than having to write border: 3px; border: solid; border-colour: white.


IMG {border:3px solid white; margin: 5px}

Any questions?