HTML Cheatsheet

<!DOCTYPE html>
<html>
  <head>
    <title>HTML Cheatsheet</title>
  </head>
  <body>
    <a href="myblog.html">Go link to other HTML</a>


    <!-- Headings -->
    <h1>Heading 1</h1>
    <h2>Heading 2</h2>
    <h3>Heading 3</h3>


    <!-- Paragraghs -->
    <p>This is a short paragraph</p>

    <p>
    This is a longer paragraph<br>
    We're using page breaks<br>
    to have it display<br>
    four lines.<br>
    </p>

    <p>This is <b>Bold text</b>.</p>

    <p>This is <strong>Important text</strong>.</p>

    <p>This is <i>Italic text</i>.</p>

    <p>This is <em>Emphasized text</em>.</p>

    <p>This is <mark>Marked text</mark>.</p>

    <p>This is <small>Small text</small>.</p>

    <p>This is <del>Deleted text</del>.</p>

    <p>This is <ins>Inserted text</ins>.</p>

    <p>This is <sub>Subscript text</sub>.</p>

    <p>This is <sup>Superscript text</sup>.</p>

    <p style="color: red;">This is red text.</p>

    <p style="font-family:courier,">This is text using courier font.</p>

    <p style="font-size:300%">This is very large text.</p>

  <!-- Lists -->

<ul>
<li>Stout</li>
<li>Mild</li>
<li>Amber</li>
<li>Pale</li>
</ul>

<ol>
<li>McGarrett</li>
<li>Williams</li>
<li>Kelly</li>
<li>Rey</li>
</ol>

  <!-- Tags -->

<dl>

<dt>Tag</dt>
  <dd>A mark that is used to distinguish HTML code from regulat text</dd>
  <dt>Element</dt>
  <dd>A pair of tags and all the content included between them</dd>
  <dt>Head</dt>
  <dd>The main element that contains information that will not be displayed in the browser</dd>
  <dd>The main element that contains information that will be displayed by the browser</dd>
</dl>

  <!-- Links -->

  <a href="https://www.theblogstarter.com/html-for-beginners#ftoc-heading-19">HTML for beginners</a>
  <br>

  <!-- Images -->

  <img src="flintcas1.jpg"  style="width:400px;height:400px;">

  <!-- Tables -->
  <table>
  <tr>
    <th>First Name</th>
    <th>Last Name</th>
    <th>Address</th>
  </tr>
  <tr>
    <td>Del</td>
    <td>Trotter</td>
    <td>Nelson Mandella House</td>
  </tr>
  <tr>
    <td>Albert</td>
    <td>Steptoe</td>
    <td>Oil Drum Lane</td>
  </tr>
  <tr>
    <td>Basil</td>
    <td>Fawlty</td>
    <td>Fawlty Towers</td>
  </tr>
  </table>

  <!-- Quotes -->

  <p>This is a example of  a regular quote-  <q>To be or not to be</q></p>

  <p>This is a example of a block quote  - <blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</blockquote></p>

  <!-- Forms -->

  <form action="process.php" method="POST">
		<div>
			<label>First Name</label>
			<input type="text" name="firstName" placeholder="Enter first name">
		</div>
		<br>
		<div>
			<label>Last Name</label>
			<input type-"text" name="LastName" placeholder="Enter last name">
		</div>
		<br>
		<div>
			<label>Email</label>
			<textarea name="message"></textarea>
		</div>
		<br>
		<div>
		  <label>Gender</label>
			<select name="Gender">
				<option value="male">Male</option>
				<option value="female">Female</option>
				<option value="other">Other</option>
			</select>
		</div>
		<br>
		<div>
			<label>Age</label>
			<input type="date" name"birthday">
		</div>
		<br>
		<input type="submit" name="submit" value="Submit">
  </form>

	<!-- Button -->

	<button>Click Me</button>
	<br>

	<!-- Comments -->

	<!- Do not display this broken image

	<img src="ahappy.jpg">

	->


	<!-- Footer -->

	<div class="footer">
		Johnmc1 Replit
	</footer>
	</div>
	</body>
</html>