CS401-lab

Student Materials for CS401

html_css

HTML

• Elements, Tags, Attributes
• alt image attribute
  • alt=accessibilty, title=tooltip
  • Bug in Chrome. Need to set width/height of img so it shows up.
• Make logo a link.
• Add a list of favorite things to do (unordered list)
• Add an order list of how to eat breakfast (ordered list)
• Nested lists.
• Tables, show bad way of adding border.
• Blockquotes, pre, code.
• Favicons
  • Generator: http://www.favicon.cc/
  • Include in head.
• Comments

CSS

• Show bad way (inline styling).
• Include style sheet in head.
• Basic selectors, properties.
• ids/classes
  • using ids to link to sections (e.g. #superheroes).
  • id for css
  • classes for css
• selectors
  • descendant combinator (e.g. div p {})
  • child combinator (e.g. div > p {})

layout

• Basic flow and layout examples
• divs/spans (block vs. inline)
• Box Model
  • Show with basic divs.
  • height, width, padding, margin, border.
• Float
  • Removes from flow.
  • vs. Alignment (aligns text in inline elements)
• Position
  • static, absolute, fixed, relative (top, bottom, left, right).
• Display
  • none (removes from flow), inline,
• Visibility
  • hidden (space still exists)

php

• PHP basics
• PHP objects

MySQL

• MySQL examples
• Accessing data with PHP examples