In this tutorial you will look at specificity. Specificity is a type of weighting that has a bearing on how your cascading style sheet (CSS) rules are displayed. All rules in your style sheet carry a specificity rating regardless of selector type, although the weighting that is given to each selector type varies and will ultimately affect the styling of your web documents.

Specificity is often the cause of problems for designers who don't yet have a firm understanding on how specificity works. If you have a particular CSS rule that looks as though it should be applying a set of styles to your web page in a certain way, but it isn't; then it is very likely that your "misbehaving rule" is being overridden by a more specific selector.

After you have completed this tutorial you will have gained the ability to use specificity to your advantage. You will also have discovered how to map CSS rules to specific elements within your web page. Specificity is a powerful tool.

The examples used in this tutorial are available through the download link below. You can reference them as you work along, or you can follow along and create the examples as you work through the tutorial.

Dreamweaver 8

• Try
• Buy

Sample files:

• specificity_sample_files.zip (ZIP, 4K)

Prerequisite Knowledge

Basic knowledge of using Dreamweaver and CSS.

Page 1 of 6

Next Page

About the author