Thomas Wallace: Lectures and Resources - A collection of website design lectures and resources

Creating and attaching a stylesheet

Before we can begin styling our document prototype there are few things we need to do to prepare.

1. Save a copy of your prototype document in both the resources directory and in the site root (inside the Personal Website folder you created)
2. Rename the file in the site root index.html
3. Open Dreamweaver and make sure you are working in your defined site.
4. Open your index.html file from the files panel.
5. From the file menu select New > Blank Page > CSS (page type)
6. Save the new css doument as screen.css in the assets/style directory.
7. On the CSS Panel, click on attach new style sheet button from the bottom right corner of the panel (it looks like a chain link)

8. In the Attach External Style sheet dialog, Browse to the screen.css file in the style folder.
9. Check Add as link.
10. Set Media Type to screen
11. Click Ok
12. Save the index.html file