BSEN307 E-Commerce Website II

DHTML-CSS-Lab-Quiz-1

Instructions Part-1:

Take this page as your source HTML.  Create an external style sheet called 'DHTML-CSS-Style' that will apply the following effects: 

  1. Apply the image 'hardwoodfloor.jp' as the background
  2. Set the text color to a shade of light yellow
  3. Center all the Heading tags
  4. Set the text color of the Heading tags to dark brown
  5. Use a class selector to affect the "Instructions" headings so that they are left justified and use the same ctext olor as the body text

Instructions Part-2:

Create two lines of text each in their own paragraph.  The first line will say.  'Mouseover this line to turn the text darker'.  Create a function that will be activated on a mouseover of the parapraph that will change the text color to a darker shade.  Create a mouseout function that will return the text to its original status.

The second line will say.  'Mouseover this line to turn the text lighter'.  Create a function that will be activated on a mouseover of the paragraph that will change the text color to a lighter shade.   Create a mouseout function that will return the text to its original status.

Insert a button on the page below this paragraph.  When this button is clicked it should change the background image to 'fallleaf.jpg'.  Make sure the mouseover functions work for the new image as well as the original image. 

Upon Completion!

Please place everything you need to make this page work correctly in a folder call DHTML-Lab-Quiz-1 and move it to your server location when completed. 

 

contact Jeff Gullion for any questions or problems: jhgullion@dmacc.cc.ia.us