Here’s a basic HTML cheat sheet
# HTML Cheat Sheet
## Basic Structure
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>Common Tags
Headings
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>Paragraphs
<p>This is a paragraph.</p>Links
<a href="https://www.example.com">This is a link</a>Images
<img src="image.jpg" alt="This is an image">Lists
Unordered List
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>Ordered List
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>Description List
<dl>
<dt>Term</dt>
<dd>Description</dd>
</dl>Tables
<table>
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
</tr>
</tbody>
</table>Forms
<form action="/submit" method="post">
<label for="name">Name:</label><br>
<input type="text" id="name" name="name"><br>
<label for="email">Email:</label><br>
<input type="email" id="email" name="email"><br>
<label for="message">Message:</label><br>
<textarea id="message" name="message"></textarea><br>
<input type="submit" value="Submit">
</form>Semantic Tags
<header>This is a header</header>
<nav>This is a navigation</nav>
<main>This is the main content</main>
<section>This is a section</section>
<article>This is an article</article>
<aside>This is a sidebar</aside>
<footer>This is a footer</footer>Inline Elements
<strong>This is bold text</strong>
<em>This is italic text</em>
<mark>This is marked text</mark>
<small>This is small text</small>
<del>This is deleted text</del>
<ins>This is inserted text</ins>
<sub>This is subscript text</sub>
<sup>This is superscript text</sup>Block elements
<div>This is a block-level container</div>
<span>This is an inline container</span>Attributes
<a href="https://www.example.com" target="_blank">This is a link</a>
<img src="image.jpg" alt="This is an image" width="500" height="300">
<input type="text" name="name" required>Header
<header>
<h1>Company Name</h1>
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</header>Nav
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>Main
<main>
<h1>My Blog</h1>
<article>
<h2>My First Blog Post</h2>
syntax highlighting. This is essential if you have code snippets within your markdown file. My markdown editor (Visual Studio Code) uses it by default, andnow I am unable to use GitHub's markdown preview or any other markdown preview without it.
Including code snippets within your markdown files increases the value of the file because developers can run code and quickly experiment. But giving code syntax highlighting can quickly differentiate the markdown file. Unfortunately, there is no proper way to give code syntax highlighting for one code snippet.
To give different languages syntax highlighting, place the code snippet within triple backticks and start the sequence of triple backticks with the language name. Here is an example of a Python code giving syntax highlighting and adding line numbers:
```python
def function_name():
'''
This is a docstring
'''
print("Hello, world")
function_name()
