Learning Code

Home

Learn the basics of HTML and CSS!

How to Use this Site

The HTML

Follow along in class as we progress through the HTML portion of this site.
  1. Read the information on the page - including any tabs and the sidebar (make sure to expand information when necessary)
  2. Use the "Try-it-yourself" editor to practice the skills for that page (click on the right side toggle)
  3. Read the HTML comment in the "Try-it-yourself" editor and follow the directions
  4. Take a screenshot (Shift-CMD-3) of the editor when you are finished

The CSS

The CSS portion of this site is intended to be used in conjuction with the game "Tralatigid". Each stage of a quest in the game will bring you to a different page with different problems to solve.
  1. Read the information on the page - including any tabs and the sidebar (make sure to expand information when necessary)
  2. Use the "Try-it-yourself" editor to practice the skills for that page (click on the right side toggle)
    • The quest stage lists the guidelines
    • Sometimes the HTML/CSS windows have helpful comments with necessary information
  3. Take a screenshot of the "Try-it-yourself" editor to record your progress when you complete that stage (Shift-CMD-3)
  4. Complete the quiz at the bottom of the quest stage
  5. Move on to the next stage or quest