He personalizado mi archivo bootstrap.css y ahora me he dado cuenta de que esto puede causar problemas la próxima vez que bootstrap publique una actualización: ¿cuál es la mejor manera de resolver este problema sin perder todo mi trabajo?

2 Respuestas


  • Incluso si tuviera que volver a agregar todos sus cambios en MENOS y compilar MENOS en CSS; si bootstrap tuviera una actualización, lo más probable es que pierda todos los cambios. Algunas actualizaciones de bootstrap (v1 a v2) cambian los nombres de las clases, por lo que perder los cambios sería el menor problema si hubieran cambiado el nombre de la clase que estaba usando.

    Por lo general, no actualizaría bootstrap cada vez que salga una actualización a menos que sea una corrección de errores para la versión actual. Debería construir su sitio en la versión que está disponible y dejarlo así hasta que tenga un rediseño o una actualización.

    Mi consejo sobre el uso futuro de bootstrap sería agregar su CSS personalizado al final del archivo Bootstrap CSS / LESS, o crear su propio archivo CSS que incluya después de su Bootstrap CSS en el encabezado de su HTML. Luego, anulará los estilos de arranque y creará los suyos propios que tengan prioridad, esto se llama especificidad y es su mejor amigo en la personalización de bibliotecas CSS.

    Si tiene dos declaraciones de estilo en el mismo elemento, la última que se defina se usará sobre la anterior.

    p {color: rojo; tamaño de fuente: 17px; }

    p {color: azul; }

    Lo anterior es un ejemplo de especificidad, la etiqueta p tendrá texto azul y será de 17px. Esto se debe a que hemos anulado la propiedad de color, pero todavía usamos la propiedad de tamaño de fuente de la declaración anterior porque no hemos anulado esa propiedad.

  • Soy bastante nuevo en bootstrap, pero después de investigar un poco, parece que hay varias formas de solucionar este problema bastante común (y molesto).

    Actualizando su archivo bootstrap.css personalizado.

    La primera forma de solucionar este molesto problema es descargar algo llamado archivo less.js. Esto le permite escribir código más sencillo y también puede resolver este problema.

    • Una vez que haya descargado less.js, inclúyalo (junto con bootstrap) en su <head>.
    • Para volver a compilar sus archivos less.js, guarde y vuelva a cargar la página. Menos los guardará en el almacenamiento local.
    • O si lo desea, puede compilar un bootstrap.css completamente nuevo con sus personalizaciones ejecutando el siguiente comando (necesitará tener la herramienta de línea de comando less instalada a través del nodo):
    • $ Lessc ./less/bootstrap.less> bootstrap.css
    Afortunadamente, existe una gran cantidad de soporte para bootstrap, por lo que generalmente se pueden encontrar soluciones para cualquier problema que pueda tener mientras desarrolla su sitio web.

    tecnología


Escribe tu respuesta

Tu respuesta aparecerá después de la moderación