Make Money Online!
Hi, I'm Ben and I own Create a Great Website! I'm currently earning well over $1,500 plus per month online in my spare time, and I want to show you how you can do the same.
Fill out the form below and I'll send you my free guide to create a great website and how you can earn money online just like I do! You won't be disappointed.
Make Money Online!
Dreamweaver CS5
Create and Apply ID Selector
This tutorial illustrates formatting CSS code in Dreamweaver CS5.
In this section we're going to look at how to create and apply an ID selector.
Let's return to the soccer story.
Select the Format menu then CSS Styles, then New... from the fly-out.
The New CSS Rule dialog appears.
This time we choose ID as the Selector Type.
For Selector Name we use FirstPara. (Note that Dreamweaver inserts the # symbol at the start of the name if we omit it
For Rule Definition choose the attached external style sheet. The completed dialog looks like this.
Click OK and the CSS Rule Definition dialog appears.
Let's specify three attributes.
On the Type page we set Font-variant to small-caps.
On the Background page we set the background-color to a light blue.
On the Block page we set Text-indent to 10 pixels.
Click on OK and the ID selector is created with the chosen properties.
To apply the new ID selector to the first paragraph of our document, we're going to use a different approach, and one that works well in this situation.
Place the cursor in the first paragraph. Note the tags at the bottom of the Document window. The last one is a <p>, which is the tag "in force" for this paragraph.
Right click on that tag, and a menu appears.
Select Set ID and a fly-out appears with a list of all available ID selectors on it. Choose FirstPara, and note the effect on the selected paragraph.
Note the small caps, the light blue background and the 10 pixel indent on the first line.
One of the advantages of saving this ID selector in the external style sheet is that we can use it in any web page to the style sheet is attached.
More Dreamweaver Tutorials
All Dreamweaver CS5 Tutorials - Will be complete by Januay 2011.
Buy Dreamweaver CS5
Find this website useful?
It will appear on your page as: Create and Apply ID Selector in Dreamweaver CS5
Share this Webpage
This site proudly build with Site Build It!
