Embellecedor CSS
Embellezca CSS: expanda los estilos minimizados en reglas legibles.
Cómo usar Embellecedor CSS
- Pegue el CSS: estilos de producción minimizados o cualquier hoja de estilo desordenada.
- Lea el resultado formateado: una declaración por línea, bloques con sangría.
- Busque y edite lo que vino a buscar: los selectores y las propiedades ahora se pueden buscar y escanear.
- Reminimizar para producción: embellecer es la forma de edición, no el envío formulario.
¿Cuál es Embellecedor CSS?
Un embellecedor CSS expande las hojas de estilo comprimidas a una forma canónica legible: cada bloque de selector en sus propias líneas, una declaración por línea, llaves y espacios consistentes. CSS minimizado (.card{margin:0 auto;padding:16px}.card h2{color:#333}) se convierte en una lista de reglas escaneable donde encontrar y editar una propiedad lleva unos segundos.
El CSS de producción se envía minimizado, por lo que cualquier inspección de los estilos reales de un sitio en vivo comienza aquí. El CSS generado (a partir de creadores, exportadores o resultados del preprocesador) llega igualmente ilegible: embellecerlo es el primer paso estándar antes de comprenderlo o recuperarlo.
Sobre el Embellecedor CSS
Pegue CSS minimizado o desordenado y obtenga resultados formateados: reglas separadas, declaraciones alineadas, anidamiento (consultas de medios, bloques de soporte) con sangría.
Lo que la gente embellece: la hoja de estilo de un sitio de producción para aprender cómo se crea un efecto (ver código fuente → copiar → embellecer → buscar el nombre de la clase), tema o complemento CSS antes de personalizarlo, estilos de proyecto antiguos escritos antes de que el equipo tuviera estándares de formato y CSS de plantilla de correo electrónico ensamblado por herramientas que nunca habían escuchado. de saltos de línea.
Editar CSS minimizado directamente es una economía falsa clásica: una llave omitida en la pared de texto rompe todas las reglas posteriores, de manera invisible. Embellezca, edite con la estructura visible y luego minimice nuevamente para el envío (el minificador CSS invierte el proceso de ida y vuelta sin pérdidas, menos los comentarios que el minificador ya eliminó).