Après avoir téléchargé un pack complet de bootstrap 3 depuis http://getbootstrap.com , j'ai remarqué qu’il existait un fichier CSS distinct pour le thème. Comment l'utiliser? S'il vous plaît, expliquez?
J'ai inclus bootstrap-theme.css dans mon projet bootstrap existant, mais il n'y a pas de différence dans les résultats.
Lors du téléchargement de Bootstrap 3.x, vous obtiendrez de bootstrap.css et bootstrap-theme.css (pour ne pas mentionner le minimisé les versions de ces fichiers qui sont également présents).
Bootstrap.css est complètement de style et prêt à l'emploi, si tel est votre désir. C'est peut-être un peu simple mais il est prêt, et il est là.
Vous n'avez pas besoin d'utiliser bootstrap-theme.css si vous ne voulez pas et tout ira bien.
Bootstrap-theme.css est juste ce que le nom du fichier est en train de suggérer: c'est un thème bootstrap qui est créative considéré comme LE bootstrap thème". Le nom du fichier confond les choses juste un peu depuis la base de bootstrap.css a déjà le style appliqué et je, considère ces styles par défaut. Mais cette conclusion est apparemment incorrect à la lumière de ce qui est dit dans le Bootstrap, documentation de la section des exemples en ce qui concerne ce bootstrap-theme.fichier css:
"La charge de l'option de Bootstrap thème pour un résultat visuellement amélioré l'expérience."
La citation ci-dessus se trouve ici http://getbootstrap.com/getting-started/#examples sur les vignettes des liens vers cette page d'exemple http://getbootstrap.com/examples/theme/. L'idée est que bootstrap-theme.css est LE bootstrap thème ET c'est facultatif.
Concernant les thèmes à BootSwatch.com: Ces thèmes ne sont pas mis en œuvre comme bootstrap-theme.css. Le BootSwatch thèmes sont des versions modifiées de l'original de bootstrap.css. Donc, vous ne devez surtout PAS utiliser un thème à partir de BootSwatch ET le bootstrap-theme.fichier css dans le même temps (sauf si vous aimez vraiment l'odeur de la merde).
Au sujet de Votre Propre Thème Personnalisé que Vous pouvez choisir de modifier bootstrap-theme.css lors de la création de votre propre thème. Cela peut rendre plus facile de faire des changements au style en évitant de casser tout cela intégré dans le Bootstrap de la bonté.
Donc il.
Pour un exemple de l'styles css jeter un oeil à: http://getbootstrap.com/examples/theme/
Si vous voulez voir comment l'exemple regarde sans le bootstrap-theme.fichier css ouvrez votre navigateur à des outils de développement et de supprimer le lien de la partie <head> de l'exemple, et vous pouvez les comparer.
Je sais que c'est une vieille question, mais qui a posté juste au cas où quelqu'un est à la recherche d'un exemple de la façon dont il semble que j'ai été.
Mise à jour
bootstrap.css = principal framework css (grilles, des styles de base, etc)
bootstrap-theme.css = étendue de style (3D boutons, dégradés, etc). Ce fichier est facultatif et n'a aucun effet sur la fonctionnalité de bootstrap, il ne fait que renforcer l'aspect.
Mise à jour 2
Avec la sortie de la v3.2.0 Bootstrap ont ajouté une option pour afficher le css du thème sur la doc pages. Si vous allez à un de la doc pages (css, composants, javascript), vous devriez voir un "Aperçu du thème" lien au bas de la navigation que vous pouvez utiliser pour activer le css du thème sur et en dehors.
Comme indiqué par d'autres, le nom de fichier bootstrap-theme.css est très déroutant. J'aurais opté pour quelque chose comme bootstrap-3d.css ou bootstrap de fantaisie.css , ce qui serait plus descriptif de ce qu'il fait réellement. Ce que le monde considère comme un "Bootstrap Thème" est une chose que vous pouvez obtenir à partir de BootSwatch qui est totalement différente d'une bête.
Cela dit, les effets sont assez agréable - les dégradés et les ombres. Malheureusement, ce fichier va faire des ravages sur BootSwatch Thèmes, j'ai donc décidé de creuser dans ce qu'il faudrait pour faire jouer gentil avec eux.
Bootstrap-theme.css est généré à partir du thème.moins fichier dans le Bootstrap de la source. Les éléments affectés sont (comme Bootstrap v3.2.0):
Le thème de.moins fichier dépend de:
@import "variables.less";
@import "mixins.less";
Le code utilise des couleurs définies dans les variables.moins, dans plusieurs endroits, par exemple:
// Give the progress background some depth
.progress {
#gradient > .vertical(@start-color: darken(@progress-bg, 4%); @end-color: @progress-bg)
}
Ce pourquoi bootstrap-theme.css totalement bousille BootSwatch Thèmes. La bonne nouvelle est que BootSwatch Thèmes sont également créés à partir de variables.moins de fichiers, de sorte que vous pouvez simplement construire un bootstrap-theme.css pour votre BootSwatch Thème.
La bonne façon de le faire est de mettre à jour le Thème du processus de construction, mais ici est la façon rapide et sale. Remplacer les variables.moins fichier dans le Bootstrap source avec l'un de vos Bootswatch Thème et de le construire et voila vous avez un bootstrap-theme.fichier css pour votre Bootswatch Thème.
La construction de Bootstrap peut sembler intimidant, mais il est en fait très simple:
Fait. Vous voyez, c'est facile, n'est-ce pas?
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
