​Content:​

1. Intro to HTML
2. Intro to CSS.
3. More HTML tags.
4. CSS text properties.
5. Web development tools.
6. CSS layout.
7. More CSS selectors.
8. Other ways to embed CSS.
9. Further learning.

Intro to HTML
​Learn what HTML is and how to make a webpage with marked up text and images.

• Welcome to the web!(Video)
• HTML basics(Scratchpad)
• Quick tip: HTML tags(Article)
• Challenge: Write a Poem(Scratchpad)
• HTML: Text emphasis(Scratchpad)
• Challenge: You can learn text tags(Scratchpad)
• HTML: Lists(Scratchpad)
• Challenge: Your learning list(Scratchpad)
• HTML: Images(Scratchpad)
• Challenge: A picture-perfect trip​

Intro to CSS
Learn how to write simple CSS rules, to select based on element, class, or ID, and change the colors of your page.

• ​CSS Basics(Scratchpad)
• Quick tip: Selecting by tag name(Article)
• Challenge: Colorful creature(Scratchpad)
• CSS: Selecting by id(Scratchpad)
• Challenge: Seasonal ids(Scratchpad)
• CSS: Selecting by class(Scratchpad)
• Challenge: Apples and bananas classes(Scratchpad)
• Quiz: Simple CSS selectors(Exercise)
• Project: Travel webpage(Scratchpad

More HTML tags
​Learn how to make links, tables, and comments

• HTML links(Scratchpad)
• Challenge: Links you love(Scratchpad)
• HTML internal links(Scratchpad)
• Challenge: Jump around(Scratchpad)
• HTML tables(Scratchpad)
• Challenge: The dinner table(Scratchpad)
• HTML comments(Scratchpad)
• Project: Recipe book

CSS text properties
Learn how to style your text, like font families, size, spacing, and alignment.

• CSS Zen Garden(Video)
• CSS font-family property(Scratchpad)
• Challenge: Fancy font families(Scratchpad)
• CSS font-size property(Scratchpad)
• Challenge: Great big font sizes(Scratchpad)
• CSS font styles and shorthand(Scratchpad)
• Challenge: Famous font formats(Scratchpad)
• More CSS text properties(Scratchpad)
• Quiz: text properties(Exercise)
• CSS inheritance(Scratchpad)
• Project: Blog

Web development tools
​Learn how to use other editors to develop your web pages and how to use the browser developer tools to debug your webpages.

• Developing webpages outside of Khan Academy(Article)
• Using the browser developer tools

CSS layout
Learn how to use the HTML span and div elements with CSS properties like position and float to change the layout of your webpages.

• ​CSS grouping elements(Scratchpad)
• Challenge: Group the groupers(Scratchpad)
• CSS width, height, and overflow(Scratchpad)
• The overflowing ocean(Scratchpad)
• CSS box model(Scratchpad)
• Challenge: The boxer model(Scratchpad)
• CSS position(Scratchpad)
• Challenge: Position planet(Scratchpad)
• CSS in the wild: Google Maps(Video)
• CSS floating elements(Scratchpad)
• Challenge: Floating clouds(Scratchpad)
• Quiz: CSS Layout(Exercise)
• Planning your webpage(Article)
• Project: Event invite

More CSS selectors
​Learn more complex selectors- using multiple classes, combing elements with classes, descendant selectors, grouped selectors, and dynamic pseudo-classes.

• Using multiple CSS classes(Scratchpad)
• Challenge: A classy gallery(Scratchpad)
• Combining CSS class and element selectors(Scratchpad)
• Challenge: Classes of elements(Scratchpad)
• CSS descendant selectors(Scratchpad)
• Challenge: Descendants of Khan(Scratchpad)
• Grouping CSS selectors(Scratchpad)
• CSS dynamic pseudo-classes(Scratchpad)
• Challenge: Grouped animals(Scratchpad)
• CSS specificity(Scratchpad)
• Quiz: CSS specificity(Exercise)

Other ways to embed CSS
Learn how to use inline styles and external stylesheets, two more ways to bring CSS into your webpage.

• ​Using inline CSS styles(Scratchpad)
• Using external stylesheets(Scratchpad)​

Further learning
What can you do to keep learning HTML and CSS?

• Webpage design(Article)
• HTML validation(Video)
• Quiz: Validate this HTML(Exercise)
• What to learn next