Session 04 - CSS

Harvard Extension School  
Fall 2020

Course Web Site: https://cscie12.dce.harvard.edu/

Topics

  1. Anatomy of a CSS Rule
  2. Box Model or Block Model
  3. Float
  4. Display: block, inline
  5. Backgrounds
  6. Lists
  7. CSS Selectors
  8. CSS Colors
  9. Fonts
  10. CSS Best Practices
  11. CSS Rules and Specificity

Session 04 - CSS, slide1
Anatomy of a CSS Rule, slide2
CSS Mechanics - Binding Styles to Markup, slide3
Box Model or Block Model, slide4
margin, padding, border, slide5
border-style, slide6
Margin, Padding, Border Example, slide7
TRBL for padding and margin shorthand, slide8
Float, slide9
Float, slide10
Float and Clear, slide11
Float and Clear, slide12
Float and Clear!, slide13
How to get image to be contained in box?, slide14
Float Opposite, slide15
Float and an adapable table-like presentation, slide16
Float adapable table-like presentation, slide17
Display: block, inline, slide18
Backgrounds, slide19
Backgrounds, slide20
Backgrounds - Icons, slide21
Backgrounds, slide22
Lists, slide23
Lists with Image, slide24
Lists that don't look like lists, slide25
CSS Selectors, slide26
Pseudo-Classes and Elements, slide27
Link Pseudo Classes, slide28
input:focus, slide29
CSS Colors, slide30
Colorpicker, slide31
Colors, slide32
Fonts, slide33
Font - @font-face, slide34
Font - Include through link element, slide35
Font - Include through JavaScript, slide36
Fonts, slide37
CSS Best Practices, slide38
Beware of Divitis and Classitis, slide39
Avoid Divitis, Classitis, Tagitis, etc., slide40
CSS Rules and Specificity, slide41
Cascade: Setup, slide42
Cascade: Stylesheet Origin, slide43
Cascade: Specificity, slide44

Presentation contains 44 slides