Not all HTML tags are of the same structure. While most elements require an opening tag, a closing tag, and
contents, some elements – known as void elements – only require an opening tag as they themselves do not contain
any elements. This topic explains and demonstrates the proper usage of void elements in HTML
Javascript
Chapter 23: Output Element
| Attribute | Description |
| Global | Attributes that are available to any HTML5 element. For comprehensive documentation of these attributes see: MDN Global attributes |
| name | A string representing the name of an output. As a form element, output can be referenced by it’s name using the document.forms property. This attribute is also used for collecting values on a form submit. |
| for | A space separated list of form element ids (e.g. <inputs id=“inp1”> for value is “inp1”) that the output is meant to display calculations for. |
| form | A string representing the <form> that is associated to the output. If the output is actually outside the , <form> this attribute will ensure that the output still belongs to the <form> and subject to collections and submits of said <form>. |
Chapter 22: Label Element
| Attributes | Description |
| for | Reference to the target ID Element. I.e: for=”surname” |
| form | HTML5, [Obsolete] Reference to the form containing the Target Element. Label elements are expected within a <form> Element. If the form=”someFormId” is provided this allows you to place the Label anywhere in the document. |
Chapter 21: Navigation Bars
Basic Navigation Bar
Navigation bars are essentially a list of links, so the ul and li elements are used to encase navigation links.
<ul> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul>
HTML5 Navigation Bar
To make a navigation bar using the HTML5 nav element, encase the links within the nav tag.
<nav> <a href="#">Home</a> <a href="#">About</a> <a href="#">Contact</a> </nav>
Chapter 20: Sectioning Elements
Nav Element
The <nav> element is primarily intended to be used for sections that contain main navigation blocks for the website, this can include links to other parts of the web page (e.g. anchors for a table of contents) or other pages entirely.
Chapter 19: Div Element
The div element in HTML is a container element that encapsulates other elements and can be used to group and
separate parts of a webpage. A div by itself does not inherently represent anything but is a powerful tool in web
design. This topic covers the purpose and applications of the div element.
Chapter 18: Forms
| Attribute | Description |
| accept-charset | Specifies the character encodings that are to be used for the form submission. |
| action | Specifies where to send the form-data when a form is submitted. |
| autocomplete | Specifies whether a form should have autocomplete on or off. |
| enctype | Specifies how the form-data should be encoded when submitting it to the server (only for method=”post”). |
| method | Specifies the HTTP method to use when sending form-data (POST or GET). |
| name | Specifies the name of a form. |
| novalidate | Specifies that the form should not be validated when submitted. |
| target | Specifies where to display the response that is received after submitting the form. |
Chapter 17: Input Control Elements
| Parameter | Details |
| class | Indicates the Class of the input |
| id | ndicates the ID of the input |
| type | Identifies the type of input control to display. Acceptable values are hidden, text, tel, url, email, password, date, time, number, range, color, checkbox, radio, file, submit, image, reset, and button. Defaults to text if not specified, if the value is invalid, or if the browser does not support the type specified. |
| name | Indicates the name of the input |
| disabled | Boolean value that indicates the input should be disabled. Disabled controls cannot be edited, are not sent on form submission, and cannot receive focus. |
| checked | When the value of the type attribute is radio or checkbox, the presence of this Boolean attribute indicates that the control is selected by default; otherwise it is ignored. |
| multiple | HTML5 Indicates multiple files or values can be passed (Applies only to file and email type inputs ) |
| placeholder | HTML5 A hint to the user of what can be entered in the control . The placeholder text must not contain carriage returns or line-feeds |
| autocomplete | HTML5 Indicates whether the value of the control can be automatically completed by the browser. |
| readonly | Boolean value that indicates the input is not editable. Readonly controls are still sent on form submission, but will not receive focus. HTML5: This attribute is ignored when the value of type attribute is either set to hidden, range, color, checkbox, radio, file or button. |
| required | HTML5 Indicates a value must be present or the element must be checked in order for the form to be submitted |
| alt | An alternative text for images, in case they are not displayed. |
| autofocus | The <input> element should get the focus when page loads. |
| value | Specifies the value of <input> element. |
| step | The step attribute specifies the legal number intervals. It works with the following input types: number, range, date, datetime-local, month, time and week. |
Chapter 16: Image Maps
| Tag/Attribute | Value |
| <img> | Below are the image map-specific attributes to use with <img>. Regular <img> attributes apply. |
| usemap | The name of the map with a hash symbol prepended to it. For example, for a map with name=“map”, the image should have usemap=“#map”. |
| <map> | |
| name | The name of the map to identify it. To be used with the image’s usemap attribute. |
| <area> | Below are <area>-specific attributes. When href is specified, making the <area> a link, <area> also supports all of the attributes of the anchor tag (<a>) except ping. See them at the MDN docs. |
| alt | The alternate text to display if images are not supported. This is only necessary if href is also set on the <area>. |
| coords | The coordinates outlining the selectable area. When shape=“polygon”, this should be set to a list of “x, y” pairs separated by commas (i.e., shape=“polygon” coords=“x1, y1, x2, y2, x3, y3, …”). When shape=”rectangle”, this should be set to left, top, right, bottom. When shape=“circle”, this should be set to centerX, centerY, radius. |
| href | The URL of the hyperlink, if specified. If it is omitted, then the <area> will not represent a hyperlink. |
| shape | The shape of the <area>. Can be set to default to select the entire image (no coords attribute necessary), circle or circ for a circle, rectangle or rect for a rectangle, and polygon or poly for a polygonal area specified by corner points. |
Chapter 15: Images
| Parameters | Details |
| src | Specifies the URL of the image |
| srcset | Images to use in different situations (e.g., high-resolution displays, small monitors, etc) |
| sizes | Image sizes between breakpoints |
| crossorigin | How the element handles crossorigin requests |
| usemap | Name of image map to use |
| ismap | Whether the image is a server-side image map |
| alt | Alternative text that should be displayed if for some reason the image could not be displayed |
| width | Specifies the width of the image (optional) |
| height | Specifies the height of the image (optional) |