What is CSS?
Cascading Styles Sheets (CSS) is a coding language that is used to change the appearance of HTML content on the web. Through the use of CSS you can keep your HTML web content from looking like just plain text.
CSS is fairly structured, so creating your own CSS styles may not be as difficult as you think. First, you will define the property you intend to change the appearance of (i.e. "background," "color," "border-size," etc.), followed by a colon. After the colon, you'll specify how you want to change it. (i.e. "white," "red," "1px," respectively). This is ended with a semicolon to show that you're done with that particular declaration. For example, if you want your text to be red, you would say "color: red;" For a thin green border, "border: 1px solid green;"
A style is made up of one or more of these CSS declarations. For example, if we want this:
Some centered, bolded light blue text with a yellow background
and a dark red, dotted border that spans the entire available width of the content area.
This is what you would put into the Properties field in Styles Manager:
border: 1px dotted #990000;
Combinations of these CSS rules can be used to do some neat things. Experimentation is a great way to discover new ways to use styles.
To learn more about what kind of CSS rules can be applied to your content, you can look over this CSS Reference document maintained by the World Wide Web Consortium (the W3C is the organization charged with maintaining the standards that define web communication - all internet browsers conform, more or less, to the W3C's published standards). These CSS rules are organized into groups, some of which are more useful than others. You are not likely, for instance, to need to understand all of the rules defined in the "2D/3D Transform group," but those in "Positioning Properties" are always helpful to understand.
- W3Schools CSS Tutorial - http://w3schools.com/css/default.asp
- CSS Tutorials from HTMLDog - Beginner, Intermediate, and Advanced
- CSS Basics - http://www.cssbasics.com/
- Hex Color Code Chart - http://www.webmonkey.com/2010/02/color_charts/
Please Sign in to leave a comment if you don't see the comment box below.