L'essentiel de Dreamweaver CC 2017

Créer un document Bootstrap

Testez gratuitement nos 1268 formations

pendant 10 jours !

Tester maintenant Afficher tous les abonnements
Si vous avez besoin de travailler en vous appuyant sur Bootstrap, vous pouvez créer un document à partir d'un modèle. Vous pouvez aussi partir d'une page blanche et la structurer en fonction des besoins.
03:42

Transcription

On peut également, pour modèle de démarrage, se baser sur un modèle Bootstrap. Alors, il y a deux manières de procéder. Soit on part sur un modèle préconfiguré, avec déjà un prérendu de site ou de style, en cliquant sur un de ces icônes-là, soit on peut également utiliser un démarrage rapide ici et utiliser ici une configuration Bootstrap. Ou on peut encore créer un nouveau type de document ici en faisant Nouveau document, et en demandant un modèle Bootstrap également. Donc c'est à vous de voir qu'est-ce qui sera le plus rapide en fonction de l'emplacement de votre souris. Si vous avez déjà créé un modèle Bootstrap au sein de ce site, vous allez forcément utiliser l'existant, et pointer vers le fichier Bootstrap.css qui est utilisé. Si, par contre, comme le cas par exemple maintenant, vous allez créer un document depuis une page vierge, il faut passer par le bouton Créer ici. Vous pouvez joindre une feuille de style personnalisée, qui pourrait contenir par exemple les couleurs du site, ou certaines typos, ou certaines particularités que vous voulez pouvoir trimbaler directement en créant le document. Vous allez utilisé une mise en page prédéfinie, et là, à ce moment-là, vous allez pouvoir la personnaliser. Prédéfinie, et à ce moment-là donc ça va utiliser si vous voulez une version de base avec certains composants, soit vous partez depuis une page complètement vierge. Vous allez pouvoir le personnaliser, en demandant un certain nombre de colonnes, de gouttières qui correspondent, et puis les dimensions qui vont correspondre à un aspect responsive, pour un smartphone, un écran de type tablette, et un écran de type ordinateur. Bien entendu, vous pouvez faire une extraction depuis les informations provenant d'un fichier Photoshop. Donc, à ce moment-là, on va pouvoir, si vous intégrez une palette, on va pouvoir faire une création directement, et au moment de la création, la palette va s'intégrer directement avec une barre de menu, et puis tout un certain nombre de contenus, l'intégralité des boutons, enfin tout ce qui est un peu nécessaire au démarrage de la création d'une page Bootstrap. Si je quitte sans enregistrer, et que je recommence ici mon opération, et cette fois-ci je vais demander de créer, alors là par défaut il me dit, mais j'ai déjà vu que tu as utilisé un Bootstrap, non, non, c'est pas celui-là, il était temporaire, c'était dans le document de travail, là pour l'instant je veux en créer un, je ne veux pas intégrer une page définie, je veux pouvoir le personnaliser, je vais rester sur ces paramètres-là, ça me va très bien, et je fais Créer, ici il me dit Attention. Bootstrap existe déjà, voulez-vous le remplacer ? Je dis oui, parce que je n'ai rien enregistré, donc il existe pas du tout dans mon fichier ici à ce niveau-là, d'accord. Ce que je vais faire ici maintenant c'est vraiment lui dire je veux enregistrer le document et là, quand je vais enregistrer mon document HTML, donc je vais l'enregistrer, et je vais l'appeler « départ-bootstrap » et là, si je fais enregistrer, tous les fichiers nécessaires, tous les documents nécessaires vont pouvoir être amenés à cet instant-là et reliés ici. Donc ici j'ai, vous voyez, j'ai mon fichier Bootstrap j'ai mes- toutes les fonts nécessaires, en fait ce sont des glyphicons qui sont nécessaires pour le document, et les images garde-place qui sont tous les placeholders gris que j'avais pu amener tout à l'heure avec le document que j'ai créé. Voilà, donc c'est très facile de pouvoir créer un document à base de Bootstrap. Tout est prêt ici, mais par contre, cette fois-ci il est vierge, il a plus qu'à être rempli. Et pour ça je vais pouvoir venir prendre les composants Bootstrap et remplir ici avec tous les éléments nécessaires. Donc, je vous invite à sauter à l'étape directement où on va parler de Bootstrap plus en détail, pour pouvoir aller plus loin sur la personnalisation et l'utilisation des composants Bootstrap. Là, l'idée c'était de pouvoir montrer démarrer depuis une page de démarrage qui s'appuie sur Bootstrap dès le départ.

L'essentiel de Dreamweaver CC 2017

Prenez en main l’environnement de travail de Dreamweaver. Créez des documents, utilisez les CSS, gérez les liens hypertexte, les fichiers multimédia, les formulaires, etc.

7h28 (98 vidéos)
Aucun commentaire n´est disponible actuellement
 
Thématiques :
Design web
Standards du web
Spécial abonnés
Votre/vos formateur(s) :
Date de parution :30 janv. 2017
Durée :7h28 (98 vidéos)

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !