HTML elements

The most common type of element used in toddle are HTML elements.

HTML elements are native to the browser, so the browser knows exactly what to do when it encounters one.

To learn more about HTML checkout MDN web docs

toddle deliberately uses HTML elements, so you always know what the browser will see when running your application. This is an integral part of building applications that are both SEO-friendly and accessible.

HTML elements are differentiated by their names or" tags." The names have special meanings, so you cannot simply rename an element.

Some tags like video , audio , and image have particular functionality built into them for displaying media.

Others, like buttons , inputs , and selections , have custom functionality for inputting data.

Some tags , such as h1, header, and li, have semantic meanings. These elements tell the browser what the content inside them represents .

Heading elements are an important concept when building web apps. They help the browser identify important parts of your application and are used both by search engines and screen readers.

Example:

A h1 element or Heading 1. represents the primary heading on a page. there should only be one h1 on a page, and it should describe what the page is about.

Attributes

HTML elements can be configured using attributes. Some attributes , such as id or class, are common for all elements .

Other attributes are element-specific, such as src, which tells an image or video element where to fetch its media content.

Read about attributes on MDN web docs

You can modify an element's attributes in the Attributes tab in the element panel.

Events

HTML elements can trigger events when the user interacts with them. The most common events are clicks and mouseovers, but there is a long list of possible events that an element can trigger.

Read about events on MDN web docs