HTML Tutorial

<p>This is a paragraph<p>

<h1>This is a header<h1>

<h2>This is a header<h2>

<h3>This is a header<h3>

<h4>This is a header<h4>

<h5>This is a header<h5>
<h6>This is a header<h6>

<b>This makes text bold</b>

<strong>This means the text is very important (looks bold)</strong>

<i>This makes text italic</i>

<em>This emphasizes words when read aloud (looks italic)</em>

<u>This adds a line under the text</u>

<s>This draws a line through text that is no longer correct</s>

<del>This shows text that was deleted from a page</del>

<mark>This highlights text with a yellow background</mark>

<tt>This turns text into an old typewriter font</tt>

<code>This styles short code snippets cleanly</code>

<kbd>This is for keyboard keys (like Ctrl or Alt)</kbd>

<samp>This shows sample output from a computer program</samp>

  • <ul><li>This is an unordered bullet point</li></ul>

  1. <ol><li>This is an automatically numbered list item</li></ol>
  2. <ol><li>This is an automatically numbered list item</li></ol>
  3. <ol><li>This is an automatically numbered list item</li></ol>
  4. <ol><li>This is an automatically numbered list item</li></ol>
<details><summary>Click here to expand text</summary>

This content stays hidden until clicked</details>


<hr> This creates a straight dividing line across the page

<input type="text"> (Text entry box)

<input type="password"> (Masked text box)

<input type="checkbox"> (Checkable box)

<button>This creates a clickable button</button>

<q>This automatically adds quote marks around text</q>

<blockquote>This blocks out and indents a large quote from another source</blockquote>

<input type="radio"> (A circular button to pick one option)


<textarea> (A large multi-line text box)

<select> (A classic drop-down list choice)

<th> Header <th> Header
<td> Cell <td> Cell

<table> and <tr> group data into horizontal rows

<audio src="sound.mp3" controls></audio> (Plays sound tracks)

<video src="video.mp4" controls width="200"></video> (Plays video clips)