Syntax


Objects and attributes

An object in html typically follows the scheme of <, followed by a piece of text which defines the type of object, then >. Most objects have to be closed after editing the body of the object, which is done by having the same object, but with / infront of the piece of text.

An attribute is what goes inside an object, it defines different attributes of the object, such as source, tooltip, color, size, etc. it usually goes after name of the object.

Example:

Text


Objects

Paragraph

A paragraph is defined using the <p> object, it doesnt have any special attributes, and it used to defined a paragraph of text.

Headings

Headings can be defined using 6 different objects, <h1> through <h6>. Each heading has a different size, with <h1> being the largest.

Examples:

Links


Objects

Anchor

A link is defined using the <a> object. The destination of the link is set using the href attribute, which takes a URL as a string. The body of the object is what the user sees and clicks on, which can be plain text or another object like an image.

By default, links open in the same tab. To open in a new tab, you can use the target attribute set to _blank.

Examples:

Images


Objects

Image

An image is defined using the <img> object. Unlike most objects, it does not have a closing tag. The source of the image is set using the src attribute, which takes a URL or a file path as a string. The alt attribute provides a text description of the image, which is shown if the image fails to load and is used by screen readers.

The width and height attributes can be used to set the size of the image in pixels. If only one is set, the other will scale proportionally.

Examples:

Images can also be made into links by wrapping the <img> object inside an <a> object.

Video


Objects

Video

A video is embedded using the <video> object. The src attribute sets the source file. The controls attribute, which takes no value, adds play, pause, and volume controls to the player. The width and height attributes set the size of the player in pixels.

Other useful attributes include autoplay, which starts the video automatically, loop, which replays the video when it ends, and muted, which starts the video without sound. Note that most browsers will not allow autoplay unless muted is also set.

Inside the <video> object you can place a <source> object, which also takes a src attribute and a type attribute describing the file format. This lets you provide multiple formats so the browser can pick one it supports. Any text placed after the <source> objects is shown only if the browser does not support the <video> object at all.

Examples:

Sound


Objects

Audio

Audio is embedded using the <audio> object. It works similarly to <video>. The src attribute sets the source file, and the controls attribute adds a simple playback bar. The autoplay, loop, and muted attributes behave the same way as they do on <video>.

Just like with video, you can place <source> objects inside <audio> to provide multiple file formats as fallbacks, and any text after the <source> objects is shown only if the browser does not support the <audio> object.

Examples: