HTML
<!DOCTYPE html>
<html>
<head>
<style>
body {
background:pink;
text-align:center;
}
</style>
</head>
<body>
<h1>A heading</h1>
<p>A paragraph</p>
<script>
function myFunction(a,b){
return a*b
}
</script>
</body>
</html>
Html elements can be nested(contain other elements)Tags are case insensitive In some tags it is not a must to have a closing tag e.g <br>
Basic Tags
| <tag> | Attributes | Expanation |
| !DOCTYPE | Document type | |
| html | lang, manifest, xmlns |
Html document |
| title | Title of the document | |
| head | Head of the document | |
| body | Body of the document | |
| h1 to h6 | Headings | |
| p | Paragraph | |
| br | Line break | |
| hr | Thematic break/horizontal line | |
| <!--...--> | Comment |
| abbr | abreviation or acronym | |
| adress | about the author | |
| b | bold text | |
| bdo | Override current text direction | |
| blockquote | Quoted from another source | |
| cite | ||
| code | Computer code | |
| del | Deleted text | |
| em | Emphasized text | |
| i | altenate voice or mood/italics | |
| ins | Inserted text | |
| kbd | Keyboard Input | |
| mark | Marked or highlighted text | |
| meter | form, high, low, max, min, optimum, value |
Measurements |
| pre | Preformatted text | |
| progress | max, value |
Show progress of a task |
| q | Short quotation | |
| rt | Pronunciation | |
| s | Text that is no longer correct | |
| samp | Sample output from coputer program | |
| small | Smaller text | |
| strong | Important text | |
| sub | Subscript | |
| sup | Superscript | |
| time | Date and time | |
| u | Different text | |
| var | Variable | |
| wbr | Possible Line Break |
| form | accept, action, autocomplete, enctype, method(get/post), name, target, novalidate |
Html user input |
| input | accept, align, alt, autocomplete, autofocus, checked, dirname, form, firmaction, formenctype, formnovalidate, formtarget, height, list, max, maxlength, min, multiple, name, pattern, placeholder, readonly, required, size, src, step, type(button,checkbox,color, date,datetime, datetime-local,email, file,hidden,image, month,number,password, radio,range,reset,search, submit,tel,text, time,url,week), value, width |
Input contol |
| textarea | autofocus, cols, dirnsme,disabled, form, maxlength, name, placeholder, readonly, required, rows |
Multiline text input |
| button | name, type, value, disabled, autofocus |
Clickable button |
| select | autofocus, disabled, form, multiple, name, size, required |
drop down/options list |
| optgroup | disabled, label |
Group of related options |
| option | disabled, label, selected, value |
options in select element |
| label | for, form |
Label for input elements |
| fieldset | groups related elememts in a form | |
| legend | Caption for fieldset | |
| datalist | specifie a list of predefined options | |
| keygen | autofocus, challenge, disabled, form, keytype, name |
a key pair generator |
| output | for, form |
show results of a calculation |
| frame | Defines a frame | |
| frameset | A set of frames | |
| noframe | Show when frames are not supported | |
| iframe | height, name, sandbox, scrolling, src, width |
Inline frame |
| img | alt, cross-origin, height, hspace, src, width, target |
Defines an image |
| map | name | client side map |
| area | alt, coords, download, href, rel, shape |
define area inside image map |
| canvas | width, height |
Container for drawing graphics using javascript> |
| figcaption | Defines a caption for a figure element | |
| figure | specifies self-contained content |
