MMDT1144 Multimedia and the Web
Week 7

Week 7

General notes:.

  • Check your work from another computer connected to the internet.  By accident you might use a relative link to graphics or files on your hard drive.  To check for this error, check your finished work from another computer!
  • Test! Test! Test!


Using CSS (Cascading Style Sheets)

Examples of recent sites where I have used CSS extensively.

Get your files for in class use from here (8 KB zipped).

Here is what the unformatted web site looks like before we add CSS.

The finished example that we are working on.


Notes on using CSS

Old style HTML tags and attributes that do formatting will overide CSS formatting.  So if you have preexisting old style HTML formatting, you will probably want to remove most of it.  Examples would be the <font> tag and the background attribute.   This can be pretty time consuming for sites that were created without using styles.  However by using the menu selection "Commands" - "Clean Up HTML..."  and then checking "Specific Tags" and entering "font", all <font> tags can be removed.

To apply inline (the most localized) CSS formatting to blocks of text, you need to manually insert '<span style="color:red">your material that is a block of interest that needs to be red</span>'


Lab 7

This lab is to test your knowledge of being able to use an external Cascading Style Sheet and to be able to apply styles across an entire site.

Create a sub folder on your web server named "lab7".  Within "lab7" you will create a mini site.

This site must contain as a minimum:

  • At least four (4) HTML files using an external CSS file.
  • An external CSS file.
  • A background image done with CSS.
  • Use of CSS to apply a style to your title.
  • Use of CSS to in your navigation bar.
  • Use of CSS to format your content.

Look at this example site for more information.

Use your imagination and creative skills. You may use advanced features if you desire.

Assignment is due at the next class period.  50% penalty if late.

Grading Criteria Possible
At least 4 HTML files all using an external CSS file. 2 2
External CSS file. 3 3
Background image done with CSS. 2 2
CSS to appy style to title. 2 2
CSS to applied to navigation bar. 2 2
CSS applied to content. 2 2
CSS used in other interesting ways. 2 2