Dreamweaver Tutorials back to dreamweaver tutorials home pagee contact form tutorial page
A value is required.Invalid format.A value is required.Invalid format.
Social Networks Our YouTube.com Channel Facebook Page

Dreamweaver Tutorial: Basics of CSS: Styling Tags

GoDaddy.com Hosting Plans Sale!Godaddy Hosting

Learn all about styling tags and how to write CSS code in Dreamweaver. By the end of this tutorial you will have a good understanding of how to write CSS, how CSS works, and how you can write your CSS code in Dreamweaver. Tutvid.com

Styling Tags in Dreamweaver CS4

In this Dreamweaver video tutorial, CSS and Dreamweaver are being used together to style different elements in one page. CSS styles are being applied to different sized head tags; i.e. H1, H2 and H3 header tags. To start off you will need to define a new site and call it whatever you like. Then create a new XHTML document and a new CSS style sheet and link it to the XHTML file. If you dont know how to define a new site and a basic web page to your site then check out this link: How to Define a new Site in Dreamweaver.

If you are not used to hand coding styles in Dreamweaver and have only used the wizard like tools in Dreamweaver, then this Dreamweaver tutorial will be a good introduction for you.

Many people who start out hand-coding in Dreamweaver will use a combination of both the wizards and hand-coding.  I myself prefer to hand code in Dreamweaver but I still use many of the wizard features for styling certain parts of my websites. Hand-coding CSS is so easy to do in Dreamweaver; it just appears daunting at first.  You will find that it is much quicker to create most of your styles manually.

new css rule

When I want to create a new style sheet for any given web page in Dreamweaver I will usually click inside of a tag I’d like to apply a style to and then click on the new CSS rule definition button.

and select a new style sheet file from the drop down menu at the bottom of the dialog box:

new style sheet

Then, when the new rule definition come up I press OK. The style sheet will be created and I the go along the top of the document window and select the CSS document from there and start hand coding!

select css

blog comments powered by Disqus

Dreamweaver Website Templates

Web Hosting Plans That I Use

  • GoDaddy.com Hosting Plans!Godaddy Hosting
  • Unlimited Hosting at HostGatorHostGator Hosting
  • JustHost.com Unlimited DomainsJustHost Hosting
  • Hosting just $4.88/month! - PowwebPow Web Hosting

PHP Luxury Contact Form Tutorial

Great Premium Shopping Cart

  • BigCommerce makes it easy to sell online. Click here to try it free!BigCommerce

    I highly reccommend this product for people who want to create an online store. it's easy to set-up and add products to and easy to manage back-of-house. Can also be used as an Ebay store.

Email Marketing - Recommended links

CSS Drop Down Menu - Dreamweaver

Floating Menu - Dreamweaver

Tabbed Navigation Menu

CSS Text Boxes in Dreamweaver

CSS 3 in Dreamweaver

J Query in Dreamweaver

Transparent Overlays Dreamweaver

CSS in Adobe Dreamweaver

All Types of Links In Dreamweaver

Positioning Elements in Dreamweaver

Unordered List Images Dreamweaver

Create an RSS Feed in Dreamweaver

Website Typography in Dreamweaver

Expanding Text Boxes - Dreamweaver

Make a Donation

Donate for Dreamweaver Tutorials