Cascading Style Sheets are all about style, looks, and presentation. CSS properties and rules give you an amazing array of control over foregrounds, backgrounds, colors, fonts, positions , alignments, margins, borders, lists, and other aspects of presentation. Appendix C contains a complete list of CSS properties. That list is amazing in its scope, but it can be a little overwhelming as well. Dreamweaver organizes all the properties listed in Appendix C into a couple of manageable interfaces: the CSS Styles Definition dialog and the CSS Styles panel. With these two features, you can control every style aspect of every element on your page. From your document's body to its divs, paragraphs, lists, tables, and links, to using spans to style individual words or even individual letters , it's all handled with the CSS Styles panel or the CSS Styles Definition dialog. Content vs. presentationContent is king, the saying goes, because users seek content when they come to your site. Content is the actual information in the headings, paragraphs, lists, divs, tables, forms, images, blockquotes, links, and other HTML elements you use on a page. With no styling, content looks something like an outline ( Figure 5.1 ). Figure 5.1. A page with no styles shows content and working links, even though it isn't beautifully arranged.
The unstyled content should be useful and informative, even if it doesn't look like much. That's because some users are getting only the text content; for instance, those with screen readers, PDA browsers, cell phone browsers, or text-only browsers. Some of these also get images, but not all, so be careful to never require images on your pages. Once you add presentation rules in a style sheet, you have the layout, color scheme, font choice, background, and other "pretties" that make a Web page look good in a standard browser ( Figure 5.2 ). The content itself hasn't changed. What has changed is the way the content is presented on the page. With different presentation, that is, different styles, the same content could look entirely different. Figure 5.2. Add styles to the same page to determine rules for layout, background, fonts, margins, and other presentation features.
The power of CSS derives from the separation of content from presentation. You can make the content look like anything you want simply by changing the way it is styled and presented.
|