Différences

Ci-dessous, les différences entre deux révisions de la page.

--- tutoriel-javascript:bootstrap:bootstrap [04/01/2016 16:05] – [Comment l'installer ?] philodenelle
+++ tutoriel-javascript:bootstrap:bootstrap [08/10/2019 17:03] (Version actuelle) – modification externe 127.0.0.1
@@ Ligne 6: / Ligne 6: @@
 Il peut être utilisé pour créer par exemple, des pages de site de présentation, pour une interface graphique d'une application web ou être intégrer à un thème d'un CMS, …
 Bootstrap est de plus en plus utilisé, il est devenu « le plus populaire des frameworks front-office pour développer des projets responsive et mobile-first sur le web. »
+\\
+\\
+\\
+===== Comment l'installer ? =====
-\\===== Comment l'installer ? =====
+\\
 ==== Première étape ====
+\\
 Se rendre sur le site officiel de Bootstrap (http://www.getbootstrap.com )
+\\
+\\
 {{ :tutoriel-javascript:bootstrap:page_de_demarrage_sur_le_guide_officiel_bootstrap_copyright_eyrolles.jpg?nolink |}}
+\\
-Page de démarrage sur le guide officiel Bootstrap (copyright – Eyrolles )
+                                           Page de démarrage sur le guide officiel Bootstrap (copyright – Eyrolles )
 ==== Deuxième étape ====
+\\
 On télécharge Bootstrap . En ouvrant le fichier du framework, on découvre ceci :
+\\
+\\
 {{ :tutoriel-javascript:bootstrap:bootstrap_files.jpg?nolink |}}
+\\
+\\
 Il y a dans le dossier, trois grandes parties :
+\\
+\\
 - css : Ce fichier reprend les propriétés de styles principales. Il va nous permettre de structurer la page et de créer les éléments de notre interface graphique.
+\\
 - fonts : Ce fichier est un fichier CSS secondaire et non obligatoire qui permet de rajouter des caractéristiques graphiques au dossier principal.
+\\
 - js : Ce fichier permet d'intégrer des éléments dynamiques. Ce fichier est une extension de la bibliothèque Jquery. Cette dernière doit être installer pour que l'on puisse utiliser les éléments dynamiques.
+\\
+\\
 Chaque partie est disponible en version « normale » ou « .min », pas une énorme différence entre les deux au niveau du code, la version « .min » ne permet pas de retour à la ligne ou de tabulations mais présente l'avantage de réduire la taille du fichier donc améliore la vitesse de chargement de la page.
-Troisième étape
+==== Troisième étape ====
+\\
 On intègre Bootstrap à notre thème, voir exemple ci-dessous :
+\\
+\\
 <code html>
 <!DOCTYPE html>
@@ Ligne 64: / Ligne 74: @@
 </html>
 </code>
+\\
+\\
 {{:tutoriel-javascript:bootstrap:pour-aller-_.png?nolink|}}
+\\
+\\
 Différents sites créés autour de Bootstrap fournissent aussi des outils supplémentaires:
-  * Bootsnipp fournit des exemples de codes et des codes supplémentaires pour enrichir Bootstrap.
+\\
-  * Bootswatch permet à la communauté de proposer de nouveaux thèmes pour personnaliser Bootstrap.
+  * **Bootsnipp** fournit des exemples de codes et des codes supplémentaires pour enrichir Bootstrap.
-  * Bootply propose de créer des Fiddles qui permettent de montrer à des personnes sur le Web des bouts de code développés avec Bootstrap.Il est ainsi possible de dialoguer facilement sur les forums, de proposer des solutions ou de montrer un problème dans un développement.
+  * **Bootswatch** permet à la communauté de proposer de nouveaux thèmes pour personnaliser Bootstrap.
+  * **Bootply** propose de créer des Fiddles qui permettent de montrer à des personnes sur le Web des bouts de code développés avec Bootstrap.Il est ainsi possible de dialoguer facilement sur les forums, de proposer des solutions ou de montrer un problème dans un développement.
+\\
+\\
+===== Notes de version =====
+  * [18/11/2017] : Harmonisation de la page
+===== Auteurs et sources =====
+  * Auteur : [[:user:montuy337513]]
+===== Navigation =====
+  * [[:accueil|Accueil]]
+  * [[:gestion-site-internet]]
+  * [[:tutoriel-javascript]]
+  * [[:tutoriel-html]]
+  * [[:tutoriel-php-mysql]]
+  * [[:tutoriel-referencement-seo]]
+<nspages -h1 -exclude:subNs: -textPages="Autres liens rapides pouvant vous intéresser">