Elementos HTML
La raíz de la página y el cuerpo que contiene todo lo que ve quien la visita. Se muestra como marcado: LUZ aplica estilos a ambos en su capa de documento.
Contiene todo lo que se ve en la página. Cada página tiene uno, justo después de head.
Solo marcado: este elemento no se representa.
<body class="o-shell">
<a class="luz-skip-link" href="#main-content">Skip to main content</a>
<main id="main-content">…</main>
</body>Con estilos de elements/document.css, sin clase. No afecta a la maquetación hasta que añadas o-shell para distribuir la barra lateral y el contenido principal.
La etiqueta más externa, que envuelve toda la página. Añade lang para que los lectores de pantalla y las herramientas de traducción elijan el idioma correcto, y data-theme para elegir el modo de color de LUZ.
Solo marcado: este elemento no se representa.
<!DOCTYPE html>
<html lang="en" data-theme="light">
<head>…</head>
<body>…</body>
</html>Con estilos de elements/document.css, sin clase. LUZ lee data-theme en este elemento: claro, oscuro o alto contraste.