1. class three: CSS review, backgrounds, font formatting, the box model

3. background-color  Hex (#ff0000)  RGB (rgb(255,0,0))  Name (red) try it: body { background-color: #F1F2E4; }

4. background-image  url(‘image.jpg’) background-repeat  repeat (default), repeat-x, repeat-y, no-repeat background-position  left, center, right, top, center, bottom  x% y% (0% 0% default)  xpos ypos background-attachment scroll (default), fixed try it: #menu { background-image:url('images/fabric_texture.jpg'); }

5. color  hex, RGB, or name text-align  left (default), center, right, or justify try it: h1 { color: #B55109; text-align:center; }

6. text-decoration  none (default), overline, line-through, underline, blink text-transform  none (default), uppercase, lowercase, capitalize try it: a { text-decoration:none; text-transform:uppercase; color: #66839E; }

7. font-size  default size is 16px  px, cm, em, %, xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger font-weight  normal(default), bold, bolder, lighter, 100-900 try it: h1 { color: #B55109; text-align:center; font-size: 4em; font-weight: 400; } h2, h3 { color: #B55109; font-size:2em; font-weight:400; }

8. font-family  syntax= font-family:individual, family;  families include: serif, sans-serif, monospace, cursive, fantasy font-style  normal(default), italic, oblique try it: body { background-color: #F1F2E4; font-family: "Trebuchet MS", Helvetica, Tahoma, sans- serif; }

9. @font-face  Allows you to use any font, provided it’s hosted somewhere on the web.  Many options: Font Squirrel, Google web fonts, TypeKit try it: TOO MUCH TEXT! Let’s just copy and paste.

10. @font-face  Needs multiple file formats to work in multiple browsers: @font-face { font-family: 'bebasregular'; src: url('webfont.eot'); /*>IE9*/ src: url('webfont.eot?#iefix') format('embedded-opentype'), /*<IE8*/ url('webfont.woff') format('woff'), /*emerging standard*/ url('webfont.ttf') format('truetype'), /*most browsers besides IE and iPhone*/ url('webfont.svg') format('svg'); /*iPhone and iPad*/ font-weight: normal; font-style: normal;

11. @font-face  Once this declaration is in place, refer to your new fonts using font-family try it: body { background-color: #F1F2E4; font-family: KameronRegular, ''Times New Roman'', serif; } In h2, h3: font-family: OstrichSansBlack, Verdana, Geneva, sans-serif; In h1: font-family: OstrichSansBlack, Verdana, Geneva, sans-serif;

12. @font-face  Once this declaration is in place, refer to your new fonts using font-family try it: footer { font-family: OstrichSansBold, Verdana, Geneva, sans-serif; font-size: 2em; text-align: center; } nav ul { font-family: OstrichSansBold, Verdana, Geneva, sans-serif; font-size: 2em; } h1 span { font-family: OstrichSansBold, Verdana, Geneva, sans-serif; }

13. is an HTML tag which allows you to just group some elements together. It doesn’t mean anything! try it: Sam & Sally's Cafe

14. Let’s use to format the copyright in the footer. html: © 2014... css: footer span { font-family: KameronRegular, ''Times New Roman'', serif; }

15. , like, doesn’t mean anything. It’s meant to divide up the page into related parts. Try it: …

16. the webpage height content width border padding margin