Minificar CSS
Minifica y comprime hojas de estilo CSS
Acerca de Minificar CSS
Reduce el CSS eliminando comentarios, saltos de línea y los espacios alrededor de llaves, signos de puntuación y combinadores, y luego muestra cuánto se redujo la hoja de estilos. Los valores, colores y unidades se quedan exactamente como están escritos, así que el ahorro viene casi por completo de los espacios y comentarios y es menor que el que lograría un optimizador CSS completo. Útil para aligerar una hoja de estilos escrita a mano antes de incrustarla en HTML.
Categoría: Minificadores.
Preguntas frecuentes
¿Qué elimina la minificación CSS?
▾
Aquí elimina los comentarios (incluidos los banners de licencia /*!), los saltos de línea, los espacios alrededor de { } : ; , > + y ~, y el punto y coma antes de cada llave de cierre. No acorta colores como #ffffff, no convierte 0px en 0 ni combina propiedades abreviadas; eso lo hacen optimizadores como cssnano o Lightning CSS.
¿La minificación cambia la salida visual?
▾
No debería, pero como el CSS no se analiza, algunos patrones se rompen: calc(100% + 10px) pierde los espacios alrededor de + que calc() exige, un selector descendiente como .menu :hover se convierte en .menu:hover y se eliminan los espacios alrededor de dos puntos o comas dentro de cadenas entre comillas. Revisa el resultado si tu hoja de estilos usa alguno de estos casos.
¿Cuánto se puede reducir el CSS en tamaño?
▾
Depende de cuánta sangría y cuántos comentarios tenga la hoja de estilos; después de minificar, la herramienta muestra el porcentaje ahorrado y el tamaño antes y después. Servir el archivo con compresión GZIP o Brotli reduce mucho más el tamaño de transferencia.
¿Puedo minificar SCSS o Less con esta herramienta?
▾
No de forma segura. Solo se eliminan los comentarios /* */, así que los comentarios de línea // se mantienen y, al unir las líneas, comentan todo lo que viene después. Compila primero a CSS y minifica el resultado.