bugl
bugl
HomeLearnPatternsSearch
HomeLearnPatternsSearch

Loading lesson path

Learn/HTML

HTML

HTML Foundations

Start with semantic structure, text, links, images, tables, lists, and the building blocks of every page.

Lesson 1visual

HTML Tutorial

HTML Tutorial

2 min
Read lesson →
Lesson 2visual

HTML Introduction

HTML Introduction

3 min
Read lesson →
Lesson 3visual

HTML Editors

HTML Editors

2 min
Read lesson →
Lesson 4visual

HTML Elements

An HTML element is defined by a start tag, some content, and an end tag. HTML Elements The HTML element is everything from the start tag to the end tag: < tagname > Content goes here... < /tagname >…

3 min
Read lesson →
Lesson 5visual

HTML Attributes

HTML Attributes

5 min
Read lesson →
Lesson 6visual

HTML Headings

HTML Headings

2 min
Read lesson →
Lesson 7visual

HTML Paragraphs

A paragraph always starts on a new line, and is usually a block of text. HTML Paragraphs The HTML <p> element defines a paragraph. A paragraph always starts on a new line, and browsers automatically…

2 min
Read lesson →
Lesson 8visual

HTML Styles

HTML Styles

2 min
Read lesson →
Lesson 9visual

HTML Text Formatting

HTML Text Formatting

3 min
Read lesson →
Lesson 10visual

HTML Quotation and Citation Elements

HTML Quotation and Citation Elements

3 min
Read lesson →
Lesson 11visual

HTML Comments

HTML comments are not displayed in the browser, but they can help document your HTML source code. HTML Comment Tag You can add comments to your HTML source by using the following syntax: <!-- Write y…

2 min
Read lesson →
Lesson 12

HTML Colors

HTML colors are specified with predefined color names, or with RGB, HEX, HSL, RGBA, or HSLA values. Color Names In HTML, a color can be specified by using a color name: Tomato Orange DodgerBlue Mediu…

2 min
Read lesson →
Lesson 13

HTML RGB and RGBA Colors

An RGB color value represents RED, GREEN, and BLUE light sources. An RGBA color value is an extension of RGB with an Alpha channel (opacity). RGB Color Values In HTML, a color can be specified as an…

2 min
Read lesson →
Lesson 14

HTML HEX Colors

A hexadecimal color is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. HEX Color Values In HTML, a color can be specifi…

2 min
Read lesson →
Lesson 15

HTML HSL and HSLA Colors

HSL stands for hue, saturation, and lightness. HSLA color values are an extension of HSL with an Alpha channel (opacity). HSL Color Values In HTML, a color can be specified using hue, saturation, and…

2 min
Read lesson →
Lesson 16visual

HTML Styles - CSS

HTML Styles - CSS

5 min
Read lesson →
Lesson 17visual

HTML Links

HTML Links

4 min
Read lesson →
Lesson 18visual

HTML Links - Different Colors

An HTML link is displayed in a different color depending on whether it has been visited, is unvisited, or is active. HTML Link Colors By default, a link will appear like this (in all browsers): An un…

2 min
Read lesson →
Lesson 19visual

HTML Links - Create Bookmarks

HTML links can be used to create bookmarks, so that readers can jump to specific parts of a web page. Create a Bookmark in HTML Bookmarks can be useful if a web page is very long. To create a bookmar…

2 min
Read lesson →
Lesson 20visual

HTML Images

HTML Images

5 min
Read lesson →
Lesson 21visual

HTML Image Maps

HTML Image Maps

4 min
Read lesson →
Lesson 22

HTML Background Images

A background image can be specified for almost any HTML element. Background Image on an HTML element To add a background image on an HTML element, use the HTML style attribute and the CSS background-…

2 min
Read lesson →
Lesson 23visual

HTML <picture> Element

The HTML <picture> element allows you to display different pictures for different devices or screen sizes. The HTML <picture> Element The HTML <picture> element gives web developers more flexibility…

2 min
Read lesson →
Lesson 24visual

HTML Favicon

HTML Favicon

2 min
Read lesson →
Lesson 25

HTML Table Sizes

HTML tables can have different sizes for each column, row or the entire table. Use the style attribute with the width or height properties to specify the size of a table, row or column. HTML Table Wi…

2 min
Read lesson →
Lesson 26

HTML Table Headers

HTML tables can have headers for each column or row, or for many columns/rows. EMIL TOBIAS LINUS 8:00 9:00 10:00 11:00 12:00 13:00 MON TUE WED THU FRI 8:00 9:00 10:00 11:00 12:00 DECEMBER HTML Table…

2 min
Read lesson →
Lesson 27

HTML Table Padding & Spacing

HTML tables can adjust the padding inside the cells, and also the space between the cells. With Padding hello hello hello hello hello hello hello hello hello With Spacing hello hello hello hello hell…

2 min
Read lesson →
Lesson 28

HTML Table Styling

Use CSS to make your tables look better. HTML Table - Zebra Stripes If you add a background color on every other table row, you will get a nice zebra stripes effect. 10 11 12 13 14 15 16 17 18 19 20…

2 min
Read lesson →
Lesson 29

HTML Table Colgroup

The <colgroup> element is used to style specific columns of a table. HTML Table Colgroup If you want to style the first two columns of a table, use the <colgroup> and <col> elements. MON TUE WED THU…

2 min
Read lesson →
Lesson 30visual

HTML Unordered Lists

HTML Unordered Lists

2 min
Read lesson →
Lesson 31visual

HTML Ordered Lists

The HTML <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical. Ordered HTML List An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The l…

2 min
Read lesson →
Lesson 32visual

HTML Other Lists

HTML also supports description lists. HTML Description Lists A description list is a list of terms, with a description of each term. The <dl> tag defines the description list, the <dt> tag defines th…

2 min
Read lesson →
Lesson 33visual

HTML Block and Inline Elements

Every HTML element has a default display value, depending on what type of element it is. The two most common display values are block and inline. Block-level Elements A block-level element always sta…

3 min
Read lesson →
Lesson 34visual

HTML Div Element

The <div> element is used as a container for other HTML elements. The <div> Element The <div> element is by default a block element, meaning that it takes all available width, and comes with line bre…

5 min
Read lesson →
Lesson 35

HTML class Attribute

HTML class Attribute

3 min
Read lesson →
Lesson 36

HTML id Attribute

HTML id Attribute

3 min
Read lesson →
Lesson 37visual

HTML Buttons

HTML Buttons

2 min
Read lesson →
Lesson 38visual

HTML Iframes

HTML Iframes

2 min
Read lesson →
Lesson 39visual

HTML JavaScript

HTML JavaScript

2 min
Read lesson →
Lesson 40visual

HTML - The Head Element

HTML - The Head Element

5 min
Read lesson →
Lesson 41visual

HTML Responsive Web Design

HTML Responsive Web Design

5 min
Read lesson →
Lesson 42visual

HTML Style Guide

HTML Style Guide

8 min
Read lesson →
Lesson 43

HTML Entities

Reserved characters in HTML must be replaced with entities: < (less than) = &lt; > (greater than) = &gt; HTML Character Entities Some characters are reserved in HTML. If you use the less than (<) or…

3 min
Read lesson →
Lesson 44visual

HTML Symbols

HTML Symbol Entities Symbols or letters that are not present on your keyboard can be added to HTML using entities. To add such symbols to an HTML page, you can use the entity name or the entity numbe…

3 min
Read lesson →
Lesson 45visual

Using Emojis in HTML

Using Emojis in HTML

2 min
Read lesson →
Lesson 46visual

HTML Encoding (Character Sets)

The HTML charset Attribute To display an HTML page correctly, a web browser must know which character set to use. The character set is specified in the <meta> tag: <meta charset="UTF-8"> The HTML spe…

2 min
Read lesson →
Lesson 47visual

HTML Uniform Resource Locators

A URL is another word for a web address. A URL can be composed of words (e.g. w3schools.com), or an Internet Protocol (IP) address (e.g. 192.68.20.50). Most people enter the name when surfing, becaus…

2 min
Read lesson →
Lesson 48visual

HTML Versus XHTML

XHTML is a stricter, more XML-based version of HTML. What is XHTML? XHTML stands for E X tensible H yper T ext M arkup L anguage XHTML is a stricter, more XML-based version of HTML XHTML is HTML defi…

3 min
Read lesson →