Skip to content

Instantly share code, notes, and snippets.

@codecademydev

codecademydev/index.html Secret

Created Jul 17, 2020
Embed
What would you like to do?
Codecademy export
<!DOCTYPE html>
<html>
<head>
<title>Sergei Bubnov's cheat sheet that will get updated (Beta version)</title>
<link href="../styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>HTML Cheat sheet</h1>
<h3>Stolen and changed by Sergei Bubnov</h3>
<h2>Table Tags</h2>
<table>
<thead>
<th>Tag</th>
<th>Name</th>
<th>Description</th>
</thead>
<tbody>
<tr>
<td><span class="code">&lt;table&gt;</span></td>
<td>Table</td>
<td>The wrapper element for all HTML tables.</td>
</tr>
<tr>
<td><span class="code">&lt;thead&gt;</span></td>
<td>Table Head</td>
<td>The set of rows defining the column headers in a table.</td>
</tr>
<tr>
<td><span class="code">&lt;tbody&gt;</span></td>
<td>Table Body</td>
<td>The set of rows containing actual table data.</td>
</tr>
<tr>
<td><span class="code">&lt;tr&gt;</span></td>
<td>Table Row</td>
<td>The table row container.</td>
</tr>
<tr>
<td><span class="code">&lt;td&gt;</span></td>
<td>Table Data</td>
<td>The table row container.</td>
</tr>
<tr>
<td><span class="code">&lt;tfoot&gt;</span></td>
<td>Table Foot</td>
<td>The set of rows defining the footer in a table.</td>
</tr>
</tbody>
</table>
<h2>Table Attributes</h2>
<table>
<thead>
<th>Attribute</th>
<th>Name</th>
<th>Description</th>
</thead>
<tbody>
<tr>
<td><span class="code">colspan</span></td>
<td>Column Span</td>
<td>Defines how many columns a td element should span.</td>
</tr>
<tr>
<td><span class="code">rowspan</span></td>
<td>Row Span</td>
<td>Defines how many rows a td element should span.</td>
</tr>
</tbody>
</table>
<table>
<h2>Validation Tags and Attributes</h2>
<thead>
<th>Attribute/Tag</th>
<th>Name</th>
<th>Description</th>
</thead>
<tbody>
<tr>
<td><span class="code">&lt;form&gt;</span></td>
<td>Form</td>
<td>Capsulates action and method inside itself.</td>
</tr>
<tr>
<td><span class="code">action</span></td>
<td>Action</td>
<td>Determines where information is sent(usually URL).</td>
</tr>
<tr>
<td><span class="code">method</span></td>
<td>Method</td>
<td>Specifies the HTTP method to use when sending form-data.</td>
</tr>
<tr>
<td><span class="code">&lt;input&gt;</span></td>
<td>Input</td>
<td>Specifies an input field where the user can enter data.</td>
</tr>
<tr>
<td><span class="code">&lt;label&gt;</span></td>
<td>Label</td>
<td>Defines a label for several elements, like checkbox, radio, password, etc.</td>
</tr>
<tr>
<td><span class="code">&lt;textarea&gt;</span></td>
<td>Textarea element</td>
<td>Defines a multi-line text input control.</td>
</tr>
<tr>
<td><span class="code">&lt;datalist&gt;</span></td>
<td>Datalist input</td>
<td>Specifies a list of pre-defined options for an <span>&lt;input&gt;</span> element.</td>
</tr>
<tr>
<td><span class="code">required</span></td>
<td>Requiring an Input</td>
<td>Makes an input require to provide information inside of it.</td>
</tr>
<tr>
<td><span class="code">pattern[]{}</span></td>
<td>Pattern</td>
<td>Specifies a regular expression that the &lt;input&gt; element's value is checked against.</td>
</tr>
</tbody>
</table>
</body>
</html>
body {
font-family: Arial, sans-serif;
background-color: gainsboro;
}
h1 {
text-align: center;
}
h2 {
color: BurlyWood;
text-align: center;
}
table {
border: 2px solid Coral;
width: 650px;
margin: 0 auto;
}
thead {
background-color: Chartreuse;
}
td {
border-top: 1px solid darkorchid;
}
.code {
font-family: monospace;
background-color: beige;
}
h3 {
text-align: center;
color: red;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.