Homework Page

CIS 50.11C - Cascading Style Sheets

Laura DeWald - Section 1385

Lesson 2 - XHTML

• Here is the table based page.
• Here is the page with the tables, javascript stripped out of it. Old code.
• Here is the page after code has been modified to pass XHTML validation Clean code.

Lesson 3/4 - CSS Basics

• Live lesson" with external style sheet added
  bus-web.css file - include a multiple selector
• Cascade Sampler
  cascade.css file
• Selector Sampler

Lesson 5 - Font and Text Properties

• Create the following files to illustrate how to stretch and shrink fonts
  • relative.html
  • relative-big.html
  • relative-sm.html
  • fixed.html
  • fixed-small.html
• Vertical Align Text sampler
• live site with font and text properties
  • css file

Lesson 6/7- Position Properties

• Box Property sampler
  CSS file
• Position Property - static
• Position Property - relative
• Position Property - absolute
• Position Property - fixed
• float and clear sampler
• Live site with <div> tags colorized
• live site with box properties
  • css file

Lesson 8 - Midterm

Lesson 9 - IE / Firefox Developer Toolkit / Browser Simulators

post your comments to the class message board

Lesson 10/11- Layout part 1 and 2

• 2 column layout using absolute positioning
• 3 column layout using absolute positioning
• 3 column with header and footer using float and clear
• Aslett clearing method
• Live site - web page
  • Live site - css file

Lesson 12 - Layout part 3

• 3 fixed columns with a background image, so the 3 columns go down the entire length of the columns.
• 3 columns with fluid side columns and 2 background images, so the 3 columns go down the entire length of the columns.
• The"live site" with a background image (fixed or fluid your choice).
• CSS file

Lesson 13 - CSS Layout Properties

• 3 column fixed centered
• 3 column fluid centered
• live site with centering trick
• CSS file that controls live site

Lesson 14 - Tables and Forms

• Table Sampler
• Styled Form

Lesson 15/16 - Navigation

• Simple horizontal navigation
• Page with links that display an image in the background that has 4 states (link, visited, hover, active)
• view image
• Horizontal navigation bar that has drop down navigation, pop out navigation, and second level pop out navigation. (for a total of 4 levels of navigation)
• Vertical Navigation
• Sliding Door Navigation

FINAL

• Original page
• Colorized divs
  • CSS The errors on this are colors that w3c doesn't have on their list of colors but they do show up.
• CSS Explained
• Images explained
• Modified page Please see "Images explained" for no image explanation
  • CSSThe errors on this are colors that w3c doesn't have on their list of colors but they do show up.