profil Bootstrap
Qu'est-ce que Bootstrap?
Bootstrap est un cadre frontal pour le développement rapide d'applications Web et des sites Web. Bootstrap est basé sur HTML, CSS, JAVASCRIPT de.
histoire
Bootstrap parMark OttoetJacob Thorntondéveloppementde Twitter.Bootstrap est Août 2011 Publication sur GitHub produits open source.
Pourquoi Bootstrap?
- Première mobile: depuis Bootstrap 3 partir, le cadre comprend des bibliothèques à travers la priorité de l' appareil mobile de style.
- Navigateurs pris en charge: Tous les principaux navigateurs supportent Bootstrap.
- Facile à utiliser: aussi longtemps que vous avez une connaissance de base de HTML et CSS, vous pouvez commencer à apprendre Bootstrap.
- responsive design: Bootstrap CSS Responsive capable de postes de travail adaptatifs, tablettes et téléphones mobiles.Pour plus d' informations sur le design réactif, disponible responsive design Bootstrap .
- Il développeurs de créer une interface simple fournit une solution unifiée.
- Il comprend un puissant composants intégrés, faciles à personnaliser.
- Il fournit également la personnalisation sur le Web.
- Il est open source.
contenu du paquet Bootstrap
- La structure de base:Bootstrap fournit la structure de base de l'arrière - plan de modèle de liaison avec un système de grille. Ceci sera expliqué en détailBootstrap fragment basique.
- CSS: Bootstrap est livré avec les caractéristiques suivantes: paramètres CSS global, définir les styles de base de l' élément HTML, la classe évolutive, et un système de grille avancée.Cette section explique en détail leBootstrap CSS.
- Composants: Bootstrap contient une douzaine de composants réutilisables pour créer des images, des menus déroulants, la navigation, boîte de pop-up boîte d' alerte, et ainsi de suite.Ceci sera expliqué plus en détaill'agencement des pièces constitutives.
- widget de JavaScript:Bootstrap contient une douzaine personnalisée plugin jQuery. Vous pouvez inclure tous les plug-ins, ces plug-ins peuvent également contenir individuellement. Ceci sera expliqué en détail lafiche Bootstrap partie.
- Personnalisation: Vous pouvez personnaliser les composants Bootstrap, variables MOINS et jQuery plug-in pour obtenir votre propre version.
exemples en ligne
Bootstrap site tutoriel contient des centaines d'exemples.
Vous pouvez utiliser notre éditeur de code de l'éditeur en ligne en ligne, puis cliquez sur le bouton Exécuter pour afficher les résultats.
exemples bootstrap
<Div class = "container">
<Div class = "jumbotron">
<H1> Ma première page Bootstrap </ h1>
<P> réinitialise la taille de la fenêtre pour voir l'effet réactif! </ P>
</ Div>
<Div class = "ligne">
<Div class = "col-sm-4 ">
<H3> Colonne 1 </ h3 >
<P> L' apprentissage est non seulement la technologie, mais aussi un rêve! </ P>
<P> rêves à nouveau Niubi, mais aussi céder la place et vous aiment bâton sucker! </ P>
</ Div>
<Div class = "col-sm-4 ">
<H3> Colonne 2 </ h3 >
<P> L' apprentissage est non seulement la technologie, mais aussi un rêve! </ P>
<P> rêves à nouveau Niubi, mais aussi céder la place et vous aiment bâton sucker! </ P>
</ Div>
<Div class = "col-sm-4 ">
<H3> Colonne 3 </ h3 >
<P> L' apprentissage est non seulement la technologie, mais aussi un rêve! </ P>
<P> rêves à nouveau Niubi, mais aussi céder la place et vous aiment bâton sucker! </ P>
</ Div>
</ Div>
</ Div>
Essayez »
D'autres exemples
Exemple 2 Bootstrap
<Div class = "table réactive">
<Table class = "Table table rayé -bordered">
<Thead>
<Tr>
<Th> # </ th>
<Th> Nom </ th>
<Th> Rue </ th>
</ Tr>
</ Thead>
<TBODY>
<Tr>
<Td> 1 </ td>
<Td> Anna Impressionnant </ td >
<Td> Broome Street </ td >
</ Tr>
<Tr>
<Td> 2 </ td>
<Td> Debbie Dallas </ td >
<Td> Houston Street </ td >
</ Tr>
<Tr>
<Td> 3 </ td>
<Td> John Doe </ td >
<Td> Madison Street </ td >
</ Tr>
</ Tbody>
</ Table>
</ Div>
Essayez »
Cliquez sur le bouton "Essayer" pour voir comment cela fonctionne.