<STYLE type="text/css"><!--
@import url(sheet2.css);
H1 {color: maroon;}
BODY {background: yellow;}
--></STYLE>

This should cause older browsers to completely ignore not only the Friday 21st of November 2008 07:43:33 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.

very common example of an increased font weight. Generally speaking,the darker and "more bold" a font appears, the heavier itis said to be. There are a great many ways to label the heaviness offonts. For example, the font family known as Zurich has a number ofvariants such as Zurich Bold, Zurich Black, Zurich UltraBlack, ZurichLight, and Zurich Regular. Each of these uses the same basic font,but each has a different weight.

So let's say that you want to use Zurich for a document, butyou'd like to make use of all those different heaviness levels.(or normal) face because there isn't aMedium face available; thus, it is assigned the same as400. As for the rest, 700 goeswith bold as always, while 800and 900, lacking a heavier face, are assigned tothe Bold font face. Finally, 600 is assigned tothe next-heavier face, which is, of course, the Bold face.

font-weight is inherited, so if you set aparagraph to be bold, then all of its childrena padding for the paragraph that is wide enough to accommodate the positioned element. Also, since it has a transparent background, the parent element's text shows through the positioned element. The only way to avoid this is to set a background for the positioned element.

Note that the boldface element in this case is positioned in relation to its parent element's content box, which defines its containing block. Without the relative positioning of the parent element, the containing block would be another element. Consider a none in your HTML documents.