HTML

From David's Wiki
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
\( \newcommand{\P}[]{\unicode{xB6}} \newcommand{\AA}[]{\unicode{x212B}} \newcommand{\empty}[]{\emptyset} \newcommand{\O}[]{\emptyset} \newcommand{\Alpha}[]{Α} \newcommand{\Beta}[]{Β} \newcommand{\Epsilon}[]{Ε} \newcommand{\Iota}[]{Ι} \newcommand{\Kappa}[]{Κ} \newcommand{\Rho}[]{Ρ} \newcommand{\Tau}[]{Τ} \newcommand{\Zeta}[]{Ζ} \newcommand{\Mu}[]{\unicode{x039C}} \newcommand{\Chi}[]{Χ} \newcommand{\Eta}[]{\unicode{x0397}} \newcommand{\Nu}[]{\unicode{x039D}} \newcommand{\Omicron}[]{\unicode{x039F}} \DeclareMathOperator{\sgn}{sgn} \def\oiint{\mathop{\vcenter{\mathchoice{\huge\unicode{x222F}\,}{\unicode{x222F}}{\unicode{x222F}}{\unicode{x222F}}}\,}\nolimits} \def\oiiint{\mathop{\vcenter{\mathchoice{\huge\unicode{x2230}\,}{\unicode{x2230}}{\unicode{x2230}}{\unicode{x2230}}}\,}\nolimits} \)

A reference for HTML5 elements

Inputs

See Bootstrap forms

Range

Documentation

<input type="range" class="" id="myRange" min="1" max="100" value="50" step="1">
Events
  • See SO Answer
  • input triggered when the value of the slider is changed
  • change triggered on mouse up

Image

<picture>
  <source srcset="bird.webp" type="image/webp">
  <source srcset="bird.jpg" type="image/jpeg"> 
  <img src="bird.jpg" alt="Great blue bird.">
</picture>
  • img alone is sufficient to show an image.
  • Wrapping around a picture allows you to specify multiple image types.

See also MDN: Responsive images

Video

See JavaScript

Canvas

See JavaScript