Discover the essentials of HTML, CSS, and JavaScript to build interactive web applications through hands-on exercises, creating modules like an image carousel and a to-do list.

This course will teach you the fundamentals of creating web applications, from the basics of creating web pages with HTML, stylizing content with CSS, all the way to building interactivity into a page using JavaScript in the browser. 
Instead of watching tedious videos and wondering how to translate those videos into real code, you'll be practicing what you learn through interactive, test-based exercises within minutes. 

Along the way, you'll be able to produce functional modules, including an image carousel and a to-do list application. No prior knowledge is needed.

Learn HTML, CSS, and JavaScript from Scratch


Each HTML element is interpreted in a specific way by your web browser. In this lesson, we will discuss **block-level** and **inline** HTML elements to gain a better understanding of how content is rendered.

# Block-level elements
Block-level HTML elements take up the full width of a web page, essentially creating a "block" around the content you place within that element. Block-level elements, by default, also start on a new line. The following are some of the block-level elements: 
- Headings (`<h1>`-`<h6>`)
- Ordered and unordered Lists (`<ol>`, `<ul>`)
- List items (`<li>`)
- Paragraphs (`<p>`)

# Inline elements
**Inline elements**, like the name suggests, do not take up the full width of a webpage and are generally *in-line* with text content. Inline elements also do not start a new line when rendered in the browser. Examples of inline elements include: 
- Anchors  (`<a>`)
- Images (`<img>`)
- Bolding text (`<strong>`)
- Emphasizing text (`<em>`)

The coding example below helps illustrate the differences between block-level and inline HTML elements:


Get an understanding of how HTML elements are rendered in the browser.

Semantic Web Page Layout with HTML

Stylizing HTML Content using CSS

Introduction to JavaScript, Basic Data Types and Operators

JavaScript Program Flow and Data Structures

Building Interactivity with DOM Manipulation

Create a To-do List Application using HTML, CSS, and JavaScript

Wrap Up

Inline vs. Block Elements and Divs