Explicar la cascada CSS
Encuentra la declaración de color ganadora y el paso decisivo de cascada.
- Funciona en tu navegador
- Sin subir archivos
- Revisa antes de descargar
Las entradas permanecen en esta pestaña; no se suben ni se guardan automáticamente. Los recuentos agregados de uso y los diagnósticos generales de procesamiento son opcionales y solo se envían con consentimiento, sin contenido ni nombres de archivo. Al borrar o cerrar se pierden las entradas; guarda antes los resultados necesarios.
Límites de recursos
Cascada de color para selectores compuestos: etiqueta/ID/clases y listas is/where/not. Hasta 64 reglas y 16 capas planas ordenadas. Compara origen, important, inline, capa, ABC y orden de fuente. Important invierte capas y orígenes. Sin ancestros, atributos, estados, scope, herencia, animación, transición ni revert. La vista previa es local y limitada: no garantiza el mismo resultado en todos los navegadores ni diseños. Lo que escribes no se ejecuta. El HTML y el CSS se descargan juntos. Límite: 8 segundos.
Cómo usarlo
- Configura el ejemplo
Describe la etiqueta, el ID y las clases del elemento de destino, y añade reglas de color indicando el origen, la importancia, si es en línea (inline) y la capa. Mantén el orden de origen de forma intencionada.
- Revisa antes de usar
Elemento p#note.note: las reglas normales de autor .note { color: #0000ff } y #note { color: #ff0000 } en la misma capa dan como resultado rojo; la especificidad 1,0,0 gana a 0,1,0.
- Exporta el resultado revisado
Lee los candidatos ordenados y el color ganador. Cambia una prioridad cada vez y compara juntos la vista previa local segura y el HTML/CSS descargado.
Preguntas y límites
¿Qué significa este resultado?
La especificidad ABC compara los ID, las clases y los tipos, después de las prioridades superiores de la cascada. !important cambia la prioridad e invierte el orden de capas y de orígenes.
¿Cómo soluciono una entrada rechazada o que falta?
Los ascendientes, atributos o estados no compatibles no se simulan en silencio. Usa selectores compuestos admitidos y listas is/where/not, y corrige los diagnósticos del analizador.
¿Qué límites tiene esta herramienta?
Cascada de color con límites: hasta 64 reglas y 16 capas planas ordenadas, con un vigilante (watchdog) de 8 s. Sin herencia, ámbito (scope), animación, transición ni revert; no es un motor de maquetación de navegador completo.