#103 · Herramienta para desarrolladores

CSS Validator

Revisa una hoja CSS para detectar problemas estructurales y declaraciones que el navegador no incorpora al CSSOM. La validación combina comprobaciones de llaves, comentarios y bloques con una comparación práctica de propiedades reconocidas. El informe no pretende sustituir un validador de especificación, pero sí ayuda a localizar errores comunes que hacen que reglas enteras o declaraciones concretas dejen de aplicarse.

Datos de entrada

Validación CSS
Espacio publicitario

Cómo usar esta herramienta para desarrolladores

  1. Pega el CSS que quieres revisar.
  2. Ejecuta la validación.
  3. Corrige primero los errores estructurales y después los avisos de declaraciones.
  4. Vuelve a validar hasta que el informe quede limpio.

Qué hace esta herramienta para desarrolladores

Comprueba pares de llaves y comentarios, intenta cargar el texto mediante CSSOM y compara declaraciones originales con las propiedades aceptadas por el navegador.

La validación informa de posiciones aproximadas para llaves desbalanceadas y detecta declaraciones con nombre o valor vacío; las propiedades descartadas se muestran como avisos.

Una propiedad experimental puede aparecer como aviso aunque sea válida en otro navegador. La herramienta valida contra el motor actual.

Ejemplo

Entrada

.box { color: red; padding: ; }

Salida

AVISO · .box · padding: valor vacío o descartado por el navegador

Casos de uso

  • Detectar CSS roto antes de publicarlo.
  • Localizar propiedades ignoradas en un navegador concreto.
  • Revisar fragmentos generados automáticamente.

Consejos para obtener resultados fiables

  • Corrige llaves y comentarios antes de interpretar avisos.
  • Valida en varios navegadores si usas propiedades experimentales.
  • No confundas propiedad desconocida con error de toda la hoja.
  • Mantén cada declaración en una línea durante la depuración.

Detalles del procesamiento

Se realiza un escaneo estructural básico y después se procesa la hoja en un documento aislado. Para reglas de estilo se contrasta el texto de cada bloque con CSSStyleDeclaration.

No implementa toda la gramática del W3C ni bases de compatibilidad. Los hacks de navegador, preprocesadores Sass/Less y sintaxis futura pueden producir falsos avisos.

Preguntas frecuentes

¿Qué diferencia hay entre un error y un aviso en este validador CSS?

Un error indica un problema estructural como llaves o comentarios sin cerrar. Un aviso suele señalar una declaración que el navegador actual descarta.

¿El CSS Validator comprueba compatibilidad entre navegadores?

No. La comprobación de propiedades se basa en el motor del navegador donde ejecutas la página.

¿Puede validar archivos SCSS o Less?

No. Debes compilar esos lenguajes a CSS antes de usar este validador.

¿Por qué una propiedad experimental aparece como no reconocida?

Porque el navegador actual puede no implementarla o exponerla de otra forma en CSSOM.

¿La herramienta indica la línea exacta del error CSS?

Los errores estructurales incluyen una línea aproximada cuando puede calcularse; los avisos de declaraciones se asocian al selector y propiedad correspondientes.

Módulos del procesamiento

MóduloFunción
Escaneo estructuralLlaves, comentarios y cadenas
CSSOMReglas interpretadas por el navegador
DiagnósticoErrores y avisos separados

Explora más herramientas de HTML, CSS y JavaScript

Consulta el centro de categoría para acceder a validadores, analizadores, generadores y utilidades relacionadas.

Ver categoría HTML, CSS y JavaScript