Working with ID Selectors

This tutorials illustrates working with ID selectors in Dreamweaver CS5.

We're now going to look at one of the more advanced aspects of CSS, and that's the use of ID selectors.

First of all, you can always identify an ID selector by the fact that its name begins with a # symbol as opposed to a period. So, an ID selector might have a name like #HeaderPage.

One of the most important things to realize about ID selectors is that each will only be used once on a page. Often the selector will be used in a specific situation, such as a page heading, where there can only be one such entry on a page.

The declaration of an ID selector can look just like the declaration of a class. For example, here is a definition written in code.

The ID selector #FirstPara has two attributes assigned, background color and text alignment.

To use the ID selector in a page the code could look like this.

and the effect on the page would look like this.

Note how the Targeted Rule in this case is selected as before, the fact that it is an ID selector being identified by the # symbol at the start of the name.

ID selectors can be particularly helpful when combining style elements, but when starting working with CSS you will probably find that using classes usually achieves the design effects you want to achieve.

More Dreamweaver CS5 Tutorials

All Dreamweaver CS5 Tutorials - Will be complete by Januay 2011.
Buy Dreamweaver CS5

Find this website useful?

To link to this page from your website, simply cut and paste the following code to your web page.

It will appear on your page as: Working with ID Selectors in Dreamweaver CS5

Share this Webpage

This site proudly build with Site Build It!