INPRG50

DATES:

1. Getting Started
   • Given a set of style sheets and XML, recode the XML to use Embedded Style Sheets, External Style Sheets, and Inline Styles.
2. Styles
   • Create a style sheet for multiple media including a browser, printer, and a mobile device.
3. CSS Fonts
   • Create a style sheet which uses different types of fonts from the various categories.
   • Make text bold or underlined, and resize the font using percentages.
4. CSS Text
   • Set the color of text, horizontally align some text to left and right justification, and use the text-transform property to specify uppercase and lowercase letters in a text.
   • Set the distance between lines.
5. Color
   • Set the foreground and background CSS colors using a hexadecimal notation for the combination of RGB: Red, Green, and Blue color values.
   • There are approximately 150 colors supported by the major browsers, use the colors from the collection of color names.
6. Background
   • Set the web page background to contain a repeating image that fills the web page.
7. Border, Margin, and Padding
   • Create borders with multiple styles.
   • Set the border width in pixels by using one of the three pre-defined values: thin, medium, or thick.
   • Specify different borders for the different sides.
   • Use the shorthand property to specify all of the border properties.
8. CSS and Links
   • There are four different selectors related to links; specify the styles for each of the selectors.
   • Set the hover style on each of the links.
   • Remove the underline from the links.
   • Reset the colors of the links.
9. Working with Lists
   • Create a basic list and remove the bullets.
   • Create a custom indent on the list.
   • Code and test for the rollover effects on a list using CSS.
   • Apply CSS to nested lists.
10. Positioning and Visibility
    • The flow is the way in which elements are laid out; sibling elements will all be in the same flow and positioned statically on the page; the order elements appear on the page is the same as the order they appear in the code. Use CSS to move elements into a separate flow.
    • Use the following positioning techniques: absolute, relative, and fixed.
    • Use the z-index property to specify the stack level of an element on the page compared to other elements in its same flow; the property takes a number as a value.

↓