cancel
 

 

Job type :

Zip Code :

community forums

Featuring over 100 topics of interest to DoItYourselfers.

Advanced Dreamweaver 8 - How to Create a New Class Style

AlertThis content requires Flash

To view this content, JavaScript must be enabled, and you need the latest version of the Adobe Flash Player.

Download the free Flash Player now!

Get Adobe Flash Player

Video Transcript

What if you want to create a completely new style? Not one that alters the existing HTML tags. Well, you do that with a class style. So again, you can right click anywhere in here to create a new style or use the little icon at the bottom of the panel. This time, I am going to select class and notice here this just changed from tag to name. Now, my H1 is still there so I need to delete it to get it out of the way. If I click over here, the only thing is the H1 I just created because I need to give this a new and unique name when I choose class.

I am going to make a headline style for my sidebar. I want that to be different from the H1. So, I am going to call this sidebar head. When you create a class style, you are suppose to put a period or a dot at the beginning of this and that is a really good habit to get in. Class style names always start with a period or a dot but Dreamweaver knows that. So, when I click okay, Dreamweaver will automatically add that dot here as it adds it to the CSS panel. So, if you forget, Dreamweaver is watching your back but it is a good habit and it is a good think to know. Class styles always have a dot at the beginning.

This time, I want to set the font to Geneva again, but I am going to set the size to 16 and now, because there is no weight already applied, the H1 tag already had bold. But if I want this style to have bold, I need to specify that. And then for the case, I am going to choose uppercase. Just a little unusual and definitely something that is not possible without HTML styles. Part of what I want to apply it here.

So, when I choose uppercase, that means that when I apply the style to text on the page, it will change the case and force it to be upper case in its display. Now, a little style note here, you should use upper case sparingly on the web. Capital letters give us a visual cues about the importance of things. This is design 101 but it is even more important on the web because capital letters tell us where sentences begin. What are proper nouns and if you remember the rules of net kit, you would probably learn way back when you first started using the internet. All caps on the internet can look like shouting.

So, I believe in this case, we can justify it or try to distinguish this kind of headline. We want it to be different. It is in the sidebar but as the general rule, I would not use upper case a lot on any page.
What if you want to create a completely new style? Not one that alters the existing HTML tags. Well, you do that with a class style. So again, you can right click anywhere in here to create a new style or use the little icon at the bottom of the... click to read more


Your Winter Home Checklist

sponsored articles of the day

diy centers

Research and explore a wealth of wisdom on these topics