HTML elements

Script and canvas

Draw with script, say what happens when script is off, and load the script itself.

`<canvas>`

MDN

A drawing area you paint with script, for charts or games. Screen readers cannot see what is drawn, so put a text alternative inside it.

HTML

<canvas id="d-canvas" width="240" height="120" role="img" aria-label="A square and a circle, drawn with the canvas API">
  A square and a circle.
</canvas>

Styled by elements/media.css, with no class. This one is drawn from the token values, so it follows the color mode.

`<noscript>`

MDN

Content that shows only when script is off or cannot run. This card shows the markup only: on this page it would never render.

Markup only: this element is not rendered.

HTML

<noscript>
  <p>This page needs JavaScript for the live demos.</p>
</noscript>

LUZ adds no style: when it shows, its content takes the styles of the elements inside it.

`<script>`

MDN

Runs JavaScript, written inline or loaded from a file. Use type="module" for the LUZ behaviors.

Markup only: this element is not rendered.

HTML

<script type="module" src="https://cdn.jsdelivr.net/npm/@luz-ds/core@0.3.0/dist/luz.min.js"></script>

LUZ adds no style: the browser look is kept.