El futuro de CSS: CSS Toggles

• Ya apareció un borrador no oficial y Chromium planea comenzar con el prototipado
• Un mecanismo para conectar CSS con el estado de objetos del DOM como casillas de verificación y botones de opción

html {  
  toggle-root: lightswitch; /* crea un toggle. 0 (desactivado, valor predeterminado) y 1 (activado) */  
}  
  
button {  
  toggle-trigger: lightswitch; /* alterna el toggle al hacer clic en el botón */  
}  
  
html:toggle(lightswitch) {  
  /* estilos que se aplicarán cuando el toggle lightswitch esté activado */  
}  

• Se pueden crear varios toggles. Pueden tener más de un estado activo y no tienen que ser necesariamente valores numéricos como 0/1
• El valor predeterminado es 0, pero se puede sobrescribir
• También es posible que un elemento sea a la vez toggle-root y toggle-trigger
• Con toggle-visibility se puede mostrar/ocultar elementos según el valor del toggle
• Se pueden agrupar con toggle-group (útil para interfaces con pestañas)

[joyfui]

Hay una forma de crear un menú de pestañas solo con CSS usando botones de opción, sin JavaScript; si esto aparece, será aún más fácil.