HTML Training - Level 2

Section 8.1. You're not in Kansas anymore
Section 8.2. Overheard on Webville's "Trading Spaces"
Section 8.3. Using CSS with XHTML
Section 8.4. Getting CSS into your XHTML
Section 8.5. Adding style to the lounge
Section 8.6. Cruising with style: the test drive
Section 8.7. Style the heading
Section 8.8. Let's put a line under the welcome message too
Section 8.9. We have the technology: specifying a second rule , just for the <h1>
Section 8.10. So, how do selections really work?
Section 8.11. Seeing selectors visually
Section 8.12. Getting the Lounge style into the elixirs and directions pages
Section 8.13. Creating the "lounge.css" file
Section 8.14. Linking from "lounge.html" to the external style
Section 8.15. Linking from "elixir.html" and "directions.html" to the external style sheet
Section 8.16. Test driving the entire lounge...
Section 8.17. It's time to talk about your inheritance ...
Section 8.18. What if we move the font up the family tree?
Section 8.19. Test drive your new CSS
Section 8.20. Overriding inheritance
Section 8.21. Test drive
Section 8.22. Adding a class to "elixir.html"
Section 8.23. Creating a selector for the class
Section 8.24. A greentea test drive
Section 8.25. Taking classes further...
Section 8.26. The world's smallest & fastest guide to how styles are applied
Section 8.27. Who gets the inheritance?
Section 8.28. Making sure the Lounge CSS validates

Section 9.1. Text and fonts from 30,000 feet
Section 9.2. What is a font family anyway?
Section 9.3. Specifying font families using CSS
Section 9.4. How font-family specifications work
Section 9.5. Dusting off Tony's Journal
Section 9.6. Getting Tony a new font-family
Section 9.7. Test driving Tony's new fonts
Section 9.8. there are no Dumb Questions
Section 9.9. How do I deal with everyone having different fonts?
Section 9.10. Adjusting font sizes
Section 9.11. So, how should I specify my font sizes?
Section 9.12. Let's make these changes to the font sizes in Tony's Web page
Section 9.13. Test driving the font sizes
Section 9.14. there are no Dumb Questions
Section 9.15. Changing a font's weight
Section 9.16. Sharpen your pencil
Section 9.17. Test drive the normal weight headings
Section 9.18. Adding style to your fonts
Section 9.19. Styling Tony's quotes with a little italic
Section 9.20. How do Web colors work?
Section 9.21. How do I specify Web colors? Let me count the ways...
Section 9.22. The two minute guide to hex codes
Section 9.23. How to find Web colors
Section 9.24. Using an online color chart
Section 9.25. there are no Dumb Questions
Section 9.26. Back to Tony's page... We're going to make the headings orange, and add an underline too
Section 9.27. Test drive Tony's orange headings
Section 9.28. Everything you ever wanted to know about text-decorations in less than one page
Section 9.29. there are no Dumb Questions
Section 9.30. Removing the underline...
Section 9.31. XHTMLcross
Section 9.32. Markup Magnets Solutions

Section 10.1. Getting Intimate with Elements
Section 10.2. The lounge gets an upgrade
Section 10.3. The new and improved, ultra-stylish lounge
Section 10.4. Setting up the new lounge
Section 10.5. Starting with a few simple upgrades
Section 10.6. A very quick test drive
Section 10.7. One more adjustment
Section 10.8. Checking out the new line height
Section 10.9. Getting ready for some major renovations
Section 10.10. A closer look at the box model
Section 10.11. What you can do to boxes
Section 10.12. Meanwhile back at the lounge...
Section 10.13. Creating the guarantee style
Section 10.14. A test drive of the paragraph border
Section 10.15. Padding, border, and margins for the guarantee
Section 10.16. Adding some padding
Section 10.17. A test drive with some padding
Section 10.18. Now let's add some margin
Section 10.19. A test drive with the margin
Section 10.20. Adding a background image
Section 10.21. Test driving the background image
Section 10.22. Fixing the background image
Section 10.23. Another test drive of the background image
Section 10.24. How do you add padding only on the left?
Section 10.25. Are we there yet?
Section 10.26. How do you increase the margin just on the right?
Section 10.27. A two-minute guide to borders
Section 10.28. Border fit and finish
Section 10.29. Congratulations!
Section 10.30. The Class Exposed
Section 10.31. The id attribute
Section 10.32. But how do I use id in CSS?
Section 10.33. Using an id in the lounge
Section 10.34. Remixing style sheets
Section 10.35. Using multiple style sheets
Section 10.36. Style sheets-they're not just for desktop browsers anymore...
Section 10.37. there are no Dumb Questions
Section 10.38. XHTML cross
Section 10.39. XHTML cross Solution

Section 11.1. A close look at the elixirs XHTML
Section 11.2. Let's explore how we can divide a page into logical sections
Section 11.3. There are no Dumb Questions
Section 11.4. Meanwhile, back at the lounge...
Section 11.5. Taking the <div> for a test drive
Section 11.6. Adding a border
Section 11.7. An over-the-border test drive
Section 11.8. Adding some real style to the elixirs section
Section 11.9. The game plan
Section 11.10. Working on the elixir width
Section 11.11. Test driving the width
Section 11.12. There are no Dumb Questions
Section 11.13. Adding the basic styles to the elixirs
Section 11.14. Test driving the new styles
Section 11.15. We're almost there...
Section 11.16. What are we trying to do?
Section 11.17. What we need is a way to select descendants
Section 11.18. There are no Dumb Questions
Section 11.19. Changing the color of the elixir headings
Section 11.20. A quick test drive...
Section 11.21. Fixing the line height
Section 11.22. Look what you've accomplished...
Section 11.23. It's time to take a little shortcut
Section 11.24. But there's more...
Section 11.25. And even more shorthands
Section 11.26. there are no Dumb Questions
Section 11.27. Adding <span>s in three easy steps
Section 11.28. Steps one and two: adding the <span>s
Section 11.29. Step three: styling the <span>s
Section 11.30. Test driving the spans
Section 11.31. there are no Dumb Questions
Section 11.32. The <a> element and its multiple personalities
Section 11.33. How can you style elements based on their state?
Section 11.34. there are no Dumb Questions
Section 11.35. Putting those pseudo-classes to work
Section 11.36. Test drive the links
Section 11.37. Isn't it about time we talk about the "cascade "?
Section 11.38. The cascade
Section 11.39. Welcome to the "What's my specificity game"
Section 11.40. there are no Dumb Questions
Section 11.41. Putting it all together
Section 11.42. there are no Dumb Questions

Section 12.1. Did you do the Super Brain Power?
Section 12.2. Use the flow , Luke
Section 12.3. BE the Browser
Section 12.4. What about inline elements ?
Section 12.5. How it all works together
Section 12.6. One more thing you should know about flow and boxes
Section 12.7. How to float an element
Section 12.8. Behind the scenes at the lounge
Section 12.9. The new Starbuzz
Section 12.10. A look at the markup
Section 12.11. And a look at the style
Section 12.12. Let's take Starbuzz to the next level
Section 12.13. Move the sidebar just below the header
Section 12.14. Set the width of the sidebar and float it
Section 12.15. Test driving Starbuzz
Section 12.16. Fixing the two-column problem
Section 12.17. Setting the margin on the main section
Section 12.18. Test drive
Section 12.19. Uh oh, we have another problem
Section 12.20. Back to clearing up the overlap problem
Section 12.21. Test drive
Section 12.22. Righty tighty, lefty loosey
Section 12.23. A quick test drive
Section 12.24. Liquid and Frozen Designs
Section 12.25. A frozen test drive
Section 12.26. What's the state between liquid and frozen? Jello , of course!
Section 12.27. Test driving with a tank of jello
Section 12.28. How absolute positioning works
Section 12.29. What the CSS does
Section 12.30. Another example of absolute positioning
Section 12.31. Using absolute positioning
Section 12.32. Changing the Starbuzz CSS
Section 12.33. Now we just need to rework the main <div>
Section 12.34. Time for the absolute test drive
Section 12.35. What can we do? Or, can't you just tell me how to do a two-column layout that doesn't break?
Section 12.36. One tradeoff you can make to fix the footer
Section 12.37. Positioning the award
Section 12.38. A small glitch
Section 12.39. Fireside Chats
Section 12.40. One more thing you should know about absolute positioning
Section 12.41. How does fixed positioning work?
Section 12.42. Putting the coupon on the page
Section 12.43. Putting the coupon on the page
Section 12.44. Using a negative left propert y value
Section 12.45. A rather positive, negative test drive
Section 12.46. Getting relative
Section 12.47. The test drive
Section 12.48. To three-columns and beyond...
Section 12.49. XHTMLcross

Section 13.1. How do you make tables with XHTML?
Section 13.2. How to create a table using XHTML
Section 13.3. What the browser creates
Section 13.4. Tables dissected
Section 13.5. there are no Dumb Questions
Section 13.6. BE the Browser
Section 13.7. Adding a caption and a summary
Section 13.8. Test drive... and start thinking about style
Section 13.9. Before we start styling, let's get the table into Tony's page
Section 13.10. Now let's style the table
Section 13.11. Taking the styled tables for a test drive
Section 13.12. there are no Dumb Questions
Section 13.13. Getting those borders to collapse
Section 13.14. How about some color?
Section 13.15. How about some color in the table rows?
Section 13.16. Did we mention that Tony made an interesting discovery in Truth or Consequences, New Mexico?
Section 13.17. Another look at Tony's table
Section 13.18. How to tell cells to span more than one row
Section 13.19. The new and improved table
Section 13.20. there are no Dumb Questions
Section 13.21. Trouble in paradise?
Section 13.22. Test driving the nested table
Section 13.23. Overriding the CSS for the nested table headings
Section 13.24. there are no Dumb Questions
Section 13.25. Giving Tony's site the final polish
Section 13.26. Giving the list some style
Section 13.27. What if you want a custom marker ?
Section 13.28. And, the final test drive...
Section 13.29. there are no Dumb Questions
Section 13.30. XHTMLcross
Section 13.31. Exercise Solutions
Section 13.32. BE the Browser

Section 14.1. How forms work
Section 14.2. How forms work in the browser
Section 14.3. What you write in XHTML
Section 14.4. What the browser creates
Section 14.5. How the form element works
Section 14.6. What can go in a form?
Section 14.7. What can go in a form? (Part II)
Section 14.8. Markup Magnets
Section 14.9. Getting ready to build the Bean Machine form
Section 14.10. Figuring out what goes in the form element
Section 14.11. Adding the form element
Section 14.12. How form element names work
Section 14.13. there are no Dumb Questions
Section 14.14. Back to getting those <input> elements into your XHTML
Section 14.15. A form-al test drive
Section 14.16. Adding some more input elements to your form
Section 14.17. Adding the <select> element
Section 14.18. Test driving the <select> element
Section 14.19. Punching the radio buttons
Section 14.20. Completing the form
Section 14.21. Adding the checkboxes and text area
Section 14.22. The final test drive
Section 14.23. Watching GET in action
Section 14.24. There are no dumb questions
Section 14.25. To Table or Not to Table? That's the question...
Section 14.26. Getting the form elements into a table: Ready Bake XHTML
Section 14.27. Test driving a very tabular form
Section 14.28. Styling the form and the table with CSS: Ready Bake CSS
Section 14.29. The final test drive
Section 14.30. What more could possibly go into a form?
Section 14.31. Markup Magnets Solution
Section 14.32. Sharpen your pencil: GET or POST

Section 7.1. What is XML ?
Section 7.2. What does this have to do with HTML?
Section 7.3. So why would you want to use XHTML?
Section 7.4. You're much closer to using XHTML than you might think
Section 7.5. Going from strict HTML to XHTML 1.0 in three steps
Section 7.6. there are no Dumb Questions
Section 7.7. Validation: it's not just for HTML
Section 7.8. Congratulations, you've just written your first XHTML!
Section 7.9. Fireside Chats
Section 7.10. HTML or XHTML? The choice is yours...
Section 7.11. Micro XHTMLcross
Section 7.12. Micro XHTMLcross Solution