Friday 21st of November 2008 06:29:45 PM

CSS Tutorials

CSS Tutorials

Welcome to the CSS Tutorials. In this section we cover Cascading Style Sheets, the powerful supplement to HTML that allows you complete control over the look of your websites. We'll show you how to create Cascading Style Sheets, and some of the cool tricks you can achieve with them.

For Beginners...

Introduction to CSS
This tutorial covers the basics: what are style sheets? How do I make a style sheet? It also shows some of the cool things you can do with style sheets.

CSS Units
A description of all the units that can be used with CSS, including lengths, percentages, colours and URL's.

For Intermediate Users...

Controlling Background Images and Colours
Learn how to use CSS properties to add background images and colour to your Web pages. Lots of neat tricks and examples are included!

Controlling Fonts with CSS
In this tutorial we take a look at how to control the fonts used in your page body text, using the various font properties that can be controlled with style sheets.

Controlling Text Appearance with CSS
This tutorial shows you how to control the layout of your text using the text properties available in CSS, such as line spacing and text alignment.

Making Lists Look Nicer with CSS
You can really go to town with HTML lists when you add a sprinkle of CSS! This tutorial shows you how to make your lists stand out from the crowd.

For Advanced Users...

CSS Positioning
This tutorial teaches you how to use CSS to position images, text, and other elements on your Web pages. Essential reading for anyone who wants to start using CSS for layout.


well as some other methods that are only moderately complex.

3.1.1. Named Colors

Assuming that you're happy with picking from a small, basic setof colors, then the easiest method is to simply use the name of thecolor you want. These are referred to, unsurprisingly enough, asnamedcolors.



6.1.1. Foreground Colors

The easiest way to set the foreground color of an element is with the property color.

color

This property accepts as a value any valid color, as discussed in Chapter 3, "Units and Values", such as #FFCC00 or rgb(100%,80%,0%). It has the effect of setting theleft-floated elements, then you would declare H2 {clear: left;}. This can be translated as "make sure that the left side of an H2 is clear of floating images" and is a replacement for the HTML construct <BR clear="left">. Figure 7-74 shows the following declaration, which uses clear to prevent H2 elements from flowing past floated elements to the left side: sheet. Beyond this type of circumstance, though, there reallyisn't much call to use float:none in your HTML documents.

7.6.2. Clear

Well, wetalked about a lot of floating behavior, so there's only onemore thing to discuss. You won't always want your content toflow past a floated element -- in some cases, you'll