Subtitles of the Movie

In general, use a Class Selector if the Style will be used in various places through out the document or the style is very general so in this example I have three text paragraphs that I'm using a Class Selector for, the style 3. Notice that down here in the Tag Selector down here I have Paragraph.style3 so that's a Class Style and I'm using this in three different locations of my document. Use an ID Tag if the style is only used once ever in the document or the style is specific to a certain area of the document. So for example up here I have a Layered DIV Tag styled with the ID called Masthead, it's the only location on this page where I will be using this style, because there is only one Masthead. Likewise, I have a Menu System over called NavBar that's a DIV Tag and the ID is called NavBar. I am only using one NavBar so that you can see that, that style is unique. It's also specific to a certain area of the document, so there's some two good examples of when you'd want to use classes verses ID Tags. I should point out that in Dreamweaver the IDs are identified here in the Properties Inspector right below that CSS P element. Notice as I select each of these DIV Tag Layers I get the name here and again these are all unique for this page. There's Content 4, Content 5, there's my Masthead. Notice that also here the geekmanauls.com, that's formatted with Heading 1 formatting option. That's a Tag definition. For my Style Classes you can see those here the Style Dropdown as well as down here in the Tag Selector DIV Dot Style 3 for that paragraph. Down there is a Library Item so there are quite a number of different kinds of styling definitions that I've created in this page. You'll also notice that when you select on the element and then open up the Dropdown Menu each time you use one of those IDs like Banner Articles, it disappears and is no longer available here. For example Adds Home, if I wanted to style that using the Adds Home or Advert then it's no longer available for you to style. So remember that an ID can only appear once in any HTML Document. Let's go back and style that, now I've lost it, it's off the page somewhere. But the point I'm trying to make is notice that this is styled with Content 4, if I go over here to my NavBar Content 4 is no longer available in this Dropdown Menu. So the Dreamweaver kind of keeps you out of trouble by following the rule that you can only use an ID once in a particular HTML document. I'll be demonstrating much more about the use of all three types of Selectors during the course of this tutorial. But to summarize here, Classes are very flexible methods for applying CSS Rules again and again within a page. Use Classes to control elements that belong to a group and to also enhance the behavior and styling of an ID. Don't use Classes for main structural elements within a page such as Headers and Navigation sections. Also before a class is needed make sure redefining an HTML Tag using a Tag Selector will be better for you, you don't want to get class happy and overuse them. I usually use Tag Selectors to style standard styles used through out the site and Classes to style exception rather then these site style standards. Use IDs to style structural sections or portions of a page, avoid using IDs when there's more then one property or setting required for the CSS rule and do not use IDs for elements that may multiply in the future such as styling images which you'll want to add additional images later or link styles or paragraphs and so on. Now once you've created your styles whichever Selector you use editing them in Dreamweaver is all the same, so let me now move onto the next movie and demonstrate how to edit styles in Dreamweaver that have already been created.