Communications Lab

Monday, September 19, 2005

Make a page using CSS

Assignment: Modify at least one of the CSS for your journal or portfolio site.

First, I sketched out my idea in Photoshop. After several iterations, I came up with this:



Of the designs that I came up with, this one was going to have the least amount of problems since I wanted my page to expand and contract depending on the users screen dimensions.

From there, I chopped up the images to be used in a table. I created the table and put the page together using Dreamweaver. As a finishing touch, I used a style sheet to determine the font and the color of the fonts for the body text. The style sheet, called style_sheet.css looks like this:

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 25px;
font-weight: normal;
color: #000000;
text-decoration: none;
}

a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 25px;
font-weight: normal;
color: #00573C;
text-decoration: none;
}

The style sheet controls the body text and the text links.

The final page looks like this!