J'ai personnalisé mon fichier bootstrap.css et j'ai maintenant réalisé que cela pourrait causer des problèmes la prochaine fois que bootstrap publiera une mise à jour - quelle est la meilleure façon de résoudre ce problème sans perdre tout mon travail ?

2 Réponses

  • Même si vous deviez ajouter toutes vos modifications dans LESS et compiler LESS en CSS ; si bootstrap devait avoir une mise à jour, vous perdriez probablement toutes vos modifications. Certaines mises à jour d'amorçage (v1 à v2) modifient les noms de classe, donc perdre vos modifications serait le moindre de vos problèmes s'ils avaient renommé la classe que vous utilisiez.

    En général, vous ne mettriez pas à niveau le bootstrap à chaque fois qu'une mise à jour sortait, à moins qu'il ne s'agisse d'une correction de bogue pour la version actuelle. Vous construirez votre site sur la version qui est sortie et en resterez là jusqu'à ce que vous ayez une refonte ou une actualisation.

    Mon conseil sur l'utilisation future de bootstrap serait d'ajouter votre css personnalisé à la fin du fichier CSS / LESS d'amorçage, ou de créer votre propre fichier CSS que vous incluez après votre CSS d'amorçage dans la tête de votre code HTML. Vous remplacerez ensuite les styles d'amorçage et créerez les vôtres qui ont la priorité, c'est ce qu'on appelle la spécificité et c'est votre meilleur ami dans la personnalisation des bibliothèques CSS.

    Si vous avez deux déclarations de style sur le même élément, la dernière définie sera utilisée sur la précédente.

    p { couleur : rouge ; taille de la police : 17 px ; }

    p { couleur:bleu; }

    Ce qui précède est un exemple de spécificité, la balise p aura du texte bleu et fera 17px. En effet, nous avons remplacé la propriété color, mais nous utilisons toujours la propriété font-size de la déclaration précédente car nous n'avons pas remplacé cette propriété.

  • Je suis plutôt nouveau dans le bootstrap, mais après avoir creusé un peu, il semble qu'il existe un certain nombre de façons de contourner ce problème plutôt courant (et ennuyeux) !

    Mise à jour de votre fichier bootstrap.css personnalisé.

    La première façon de contourner ce problème ennuyeux est de télécharger quelque chose appelé le fichier less.js. Cela vous permet d'écrire du code plus léger et peut également résoudre ce problème.

    • Après avoir téléchargé less.js, incluez-le (avec bootstrap) dans votre <head>.
    • Pour recompiler vos fichiers less.js, enregistrez et rechargez la page. Moins les sauvera dans le stockage local.
    • Ou si vous le souhaitez, vous pouvez compiler un tout nouveau bootstrap.css avec vos personnalisations en exécutant la commande suivante (vous aurez besoin d'avoir l'outil de ligne de commande less installé via le nœud) :
    • $ Lessc ./less/bootstrap.less > bootstrap.css
    Heureusement, il existe de nombreux supports pour le bootstrap, donc généralement des solutions peuvent être trouvées pour tout problème que vous pourriez rencontrer lors du développement de votre site Web.

    la technologie


Ecrivez votre réponse

Votre réponse apparaîtra après modération

Questions connexes