Session 03 - HTML Forms & Tables, Introduction to CSS

Harvard Extension School  
Fall 2021

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

Topics

  1. Markup Recap
  2. Accessibility
  3. Forms - Basic
  4. Accessibility: Label Element
  5. HTML5 forms
  6. Tables
  7. Accessibilty of Tables
  8. Presentation - Cascading Style Sheets (CSS)
  9. CSS Mechanics - rules and selectors
  10. Basic Selectors - elements, class, id
  11. CSS Properties and Values
  12. Box Model or Block Model
  13. display property
  14. Tools: Your Browser

Session 03 - HTML Forms & Tables, Introduction to CSS, slide1
Markup Recap, slide2
Components of HTML Elements, slide3
Essential HTML5 Document Structure, slide4
Accessibility, slide5
Forms - Basic, slide6
Forms, slide7
Forms, slide8
form, slide9
HTTP Method: Get vs. Post, slide10
Text Field, slide11
Radio Buttons, slide12
Checkbox, slide13
Textarea, slide14
Select and Option, slide15
Accessibility: Label Element, slide16
Accessibility: Label Element, slide17
Label Element - using id, label, for, slide18
Labels, slide19
fieldset and legend, slide20
optgroup, slide21
HTML5 forms, slide22
HTML5: Placeholder, slide23
HTML5: Autofocus, slide24
HTML5: email and url, slide25
HTML5: number and range, slide26
HTML5: date and time, slide27
submit.php -- it can do more!, slide28
Tables, slide29
A Simple Table, slide30
Adding thead, tfoot, tbody, caption, and summary, slide31
Benefits of Semantics, slide32
Using "col" and "colgroup", slide33
Accessibilty of Tables, slide34
Accessibility using "headers", slide35
What can we do now that relationship is clear?, slide36
Presentation - Cascading Style Sheets (CSS), slide37
Markup, Presentation, Function, slide38
Styles, slide39
Different Styles for The United States Constitution, slide40
Harvard Summer School, slide41
Responsive Web Design, slide42
CSS Recommendations from the W3C, slide43
CSS Mechanics - rules and selectors, slide44
Anatomy of a CSS Rule, slide45
Simple CSS Example, slide46
CSS Mechanics - Binding Styles to Markup, slide47
style attribute, slide48
style element, slide49
link element, slide50
Combining Rules, slide51
Combining Selectors, slide52
Basic Selectors - elements, class, id, slide53
class selectors, slide54
id selectors, slide55
Contextual Selectors, slide56
CSS Properties and Values, slide57
Inheritance, slide58
Sample "UA" default stylesheets for HTML 2.0 and HTML 4.0, slide59
font properties, slide60
font-family, slide61
font-style, slide62
font-variant and font-weight, slide63
font-size, slide64
Font Sizes: Relative vs. Absolute, slide65
font, slide66
text properties, slide67
CSS Values and Units, slide68
Color Units, slide69
Colorpicker, slide70
Box Model or Block Model, slide71
margin, padding, border, slide72
border-style, slide73
TRBL for padding and margin shorthand, slide74
Margin, Padding, Border Example, slide75
display property, slide76
Tools: Your Browser, slide77
Web Browsers and Layout Engines, slide78
Testdrive Your Browser, slide79

Presentation contains 79 slides