How to Use CSS Styles in Dreamweaver

It seems CSS styles has recently became the thing with web designers. I prefer to use CSS on my web sites, it makes it easier to control the text through out the hole site. CSS stands for Cascading Style Sheet . A CSS Style sheet will allow the style information to be specified in many different ways. So let’s get started. You will need to open your dreamweaver program and open a page with text or you can create a new page. Please look at the pictures to your top right to help you out if you get lost.

Step 1
Right click your mouse. A drop down box will appear. Click Css Styles/New.

Step 2
Then a box will appear called “New CSS Style”. Where it says name, you can name it whatever you prefer.
For example, .myfirstcss
Under Selector type, select “Class”. Under Define in, select “New Style Sheet File” and then click OK.

Step 3
A window will appear asking you to save this style sheet. Name your sheet “style” and click OK.

Step 4
Once you click OK to save your style sheet, a window will appear called “CSS Style Definition for (whatever you named your style) in style.css”. Under Category click “Type”. Then you will see font, size, style, color, etc. Fill those fields in to your liking. Once you have done that, click OK.

Step 5
Click the tab at the top that says “style.css”. That will bring up a page with coding on it. Once you have that page up click “File/Save”.

You have just made your first CSS Style!!!

Step 6
Go back to your window with your text on it and we will now apply the CSS style to the text. Using your mouse highlight over the text that you want to change. Once you have it highlighted, right click your mouse. In the drop down box click “CSS Styles/myfirstcss(or whatever you named your style)”

Now your text should be changed. This is just the basic stuff you can do with CSS. Play around with the other options under categories to change your text up a bit. You can add background, lines, and more to your text.