Introduction - In unit Nine
we will explore techniques for using Cascading Style Sheets. This is a
very handy and popular technique for creating attractive web pages and
reducing the effort required. In every case you are required to create
the given assignment
in a MY Documents folder, save it as a web page or style sheet under
the My Documents
folder, and only then post it on your web site. You may
use any editing tools including Notepad, Arachnophilia or the Mozilla
editor.
- You must complete all of the Unit 8 projects before
proceeding to Unit 9.
- Each project must be in its own folder, both in your work
area and when you post it on your web site.
- You must conform to existing standards for naming your
folders, documents and titles and for including standard comments in
your pages.
- These projects are not completed until you have posted them
on your Internet site.
There are five projects in this
unit:
Unit 9, Project 1. Add an internal
style sheet to the HEAD
section of a page of your choice to show the following effects:
- Set the background color to a
light gray, rgb values of
200,200,200.
- Set a fixed 100x100 pixel background image of your own
choosing that stays at the top of the display
- Set the text color to Red with
transparent background,
oblique style and bold.
Unit 9, Project 2.
- Find the CSS study materials offered by the W3 Schools
website.
- Copy the style sheets found at the "See how it works"
selection ( http://www.w3schools.com/css/demo_default.htm )under the CSS Demo heading into your own area.
- Select at least five of your first quarter projects.
- Modify them to include each of the five style sheets using
the LINK command.
- You do not have to post these results on your Geo-cities
account but you must demonstrate the ability to change the style sheet
being selected and make it work.
Unit 9, Project 3. Study the style
sheets you downloaded in Project 2. Consult the online reference
materials for CSS for correct spellings and formats of commands. Create
a new style sheet that will carry the following properties:
- Paragraphs, tables, list elements and headings will use
Times New Roman font if it is available, or Ariel or Sans Serif as
backup fonts.
- Paragraphs, headings, tables, list elements, and horizontal
rulers will use a left margin set at twenty points.
- Paragraphs, list elements, table headers and table cells
will use a font size equal to eighty-five percent.
- Ordered lists will display hebrew numbers
- The background color will be set to rgb values of 220,
250, 250.
- All headings will be set to a color of green.
- All active and unused links wil be set to a color of
red.
- All visited links will be set to a color of blue.
- When the user hovers the mouse over a link it will turn
yellow.
Unit 9, Project 4.
- Create a folder on your Geocities website called Style. This will
hold style sheetes for use on your website.
- Transfer all six of the style sheets you have created so far to
this folder.
- Select six projects that you halve already uploaded to your
Geocities portfolio.
- Modify each of them to use one of the style sheets in your style
folder.
- Use relative addressing in your href commands so that your style
sheets can be used from your style folder.
Unit 9, Project 5.