Join Laurie Burruss for an in-depth discussion in this video Styling header tags, part of Creating a CSS Style Guide: Hands-On Training.
- View Offline
Using the padding and margins correctly really helps to make the page look like…a page. When I'm starting to work on a page and try to get the balance between…the layout and the styling, I always try to nail the layout before I start…doing the styles within the document. My rule of thumb is if you don't know how…to start styling a document, work from the outside in. So we have styled…the body, we have styled the content div and now we are ready to go in and style…the elements that we set up semantically in the HTML document.…
The first things that I would like to style will be the headers, h1, h2, h3.…This is really easy to do inside of Dreamweaver. Simply place your I-beam in…the first header, h1. This is our main header. Return to the CSS panel and…select New CSS Rule. When the New CSS dialog box opens we are only interested…in creating a style for the h1 tag. So for selector type, choose Tag. Notice…that we are just right where we want to be because our I-beam is in that area.…
Again, by default Dreamweaver will continue to save our styles and define them…
Download the exercise files from the Exercise Files tab.
- Planning a site from a blank file
- Creating and editing a style guide with just HTML
- Using the Property Inspector for text markup
- Inserting images, tables, and footers for a custom look
- Creating and editing an external CSS style sheet
- Building a custom color palette for a site
- Testing web pages in various browsers
- Styling tips for professional sites