HTML and CSS Crash Course

Course Curriculum

Chapter 1: VS Code

Lecture 1: VS Code Introduction

Lecture 2: Install VS Code

Lecture 3: My VS Code Settings

Lecture 4: Install Live Preview Extension

Lecture 5: VS Code Alternative: Replit

Lecture 6: Getting Help: Google and Stack Overflow

Lecture 7: Downloading code for this course: GitHub

Lecture 8: Advice: Copy first, then improvise

Lecture 9: Introduction Recap

Chapter 2: HTML Basics

Lecture 1: HTML Basics Introduction

Lecture 2: Create HTML file

Lecture 3: Add boilerplate code

Lecture 4: Tags, content, and elements

Lecture 5: Attributes and values

Lecture 6: Title element

Lecture 7: Live Preview alternative

Lecture 8: HTML Basics Recap

Chapter 3: Paragraph Element

Lecture 1: Paragraph Element Introduction

Lecture 2: Paragraph element

Lecture 3: Emmet

Lecture 4: Lorem ipsum text

Lecture 5: HTML comments

Lecture 6: Whitespace

Lecture 7: Advice: Absolutes and exceptions

Lecture 8: Paragraph Element Recap

Chapter 4: Heading Elements

Lecture 1: Heading Elements Introduction

Lecture 2: Heading elements

Lecture 3: Heading order

Lecture 4: Validate HTML

Lecture 5: Heading Elements Recap

Chapter 5: List Elements

Lecture 1: List Elements Introduction

Lecture 2: Ordered list element

Lecture 3: Unordered list element

Lecture 4: List Elements Recap

Chapter 6: Anchor Elements (Links)

Lecture 1: Anchor Elements Introduction

Lecture 2: Creating more HTML files

Lecture 3: Internal links

Lecture 4: External links

Lecture 5: Open link in new tab

Lecture 6: View Page Source

Lecture 7: Anchor Elements Recap

Chapter 7: Image Element

Lecture 1: Image Element Introduction

Lecture 2: Downloading images

Lecture 3: Image element

Lecture 4: Image Element Recap

Chapter 8: Learning More

Lecture 1: Learning More Introduction

Lecture 2: Mozilla Developer Network and HTML elements list

Lecture 3: Deprecated Elements

Lecture 4: Learning More Recap

Chapter 9: CSS Basics

Lecture 1: CSS Basics Introduction

Lecture 2: Creating a CSS file

Lecture 3: Link element

Lecture 4: CSS rules

Lecture 5: CSS comments

Lecture 6: CSS Basics Recap

Chapter 10: CSS Colors

Lecture 1: CSS Colors Introduction

Lecture 2: Background color property

Lecture 3: Hex colors

Lecture 4: RGB colors

Lecture 5: CSS Colors Recap

Chapter 11: CSS Fonts

Lecture 1: CSS Fonts Introduction

Lecture 2: Font properties

Lecture 3: Line height property

Lecture 4: CSS Fonts Recap

Chapter 12: CSS Borders and Spacing

Lecture 1: CSS Borders and Spacing Introduction

Lecture 2: Border properties

Lecture 3: Padding properties

Lecture 4: Margin properties

Lecture 5: CSS Borders and Spacing Recap

Chapter 13: CSS Selectors

Lecture 1: CSS Selectors Introduction

Lecture 2: Class selector

Lecture 3: ID selector

Lecture 4: Selector list

Lecture 5: CSS Selectors Recap

Chapter 14: CSS Elements

Lecture 1: CSS Elements Introduction

Lecture 2: Span element

Lecture 3: Div element

Lecture 4: CSS Elements Recap

Chapter 15: CSS Concepts

Lecture 1: CSS Concepts Introduction

Lecture 2: Specificity

Lecture 3: Cascade

Lecture 4: Inheritance

Lecture 5: !important keyword