Bootstrap, de Twitter, est actuellement le cadre frontal le plus populaire. Bootstrap est basé sur HTML, CSS et JavaScript. Il est simple et flexible, ce qui rend le développement Web plus rapide.
Points clés pour l'apprentissage:
1. Composant de chemin
2. Composants de pagination
3. Composants de balise
4. Composants du badge
Dans cette leçon, nous apprendrons principalement les quatre fonctions de composants de Bootstrap: composant de chemin, composant de pagination, composant d'étiquette et composant de badge.
un. Composant de chemin
Le composant de chemin est également appelé navigation au fil du fil.
// Navigation au pain <lo> <li> <a href = "#"> Accueil </a> </li> <li> <a href = "#"> Liste de produits </a> </li> <li> Version coréenne du pull en cachemire 2015 </li> </l>
deux. Composants de pagination
Le composant de pagination peut fournir des fonctionnalités avec des pages d'affichage.
// Pagination par défaut <ul> <li> <a href = "#"> «</a> </li> <li> <a href =" # "> 1 </a> </li> <li> <a href =" # "> 2 </a> </li> <li> <a href =" # "> 3 </a> </li> <li> <a href = "#"> 4 </a> </li> <li> <a href = "#"> 5 </a> </li> </ul> // Préférences et désactive <li> <a href = "#"> 1 </a> </li> <li> <a href = "#"> 2 </a> </li> // Effets <ul> <li> <a href = "#"> 1 </a> </li> </li> // Set tailles, quatre lg, par défaut, sm et xs <ul> // Page Turn Effets <ul> <li> <a href = "#"> Page précédente </a> </li> <li> <a href = "#"> Page suivante </a> <ul> <li> <a href = "#"> Page précédente </a> </li> </ul> // Désactivez la page Turn Item <li> <a href = "#"> page précédente </a> </li>
trois. Étiquette
//Tags with the tag <h3> tag <span>new</span></h3> //Tags of different tones <h3> tags <span>new</span></h3><h3> tags <span>new</span></h3><h3> tags <span>new</span></h3><h3> tags <span>new</span></h3><h3> tags <span> nouveau </span> </h3>
Quatre. badge
// Badge de quantité d'informations non lus <a href = "#"> Informations <span> 10 </span> </a> // Utilisez un badge dans Button <button> Soumettre <span> 3 </span> </futton> // Le statut d'activation adapte automatiquement le ton <ul> <li> <a href = "#"> HomePage <spande> 2 </span> </a> href = "#"> Informations </a> </li> </ul>
Ce qui précède est la balise de pagination de chemin et le composant de badge du composant bootstrap qui vous est présenté par l'éditeur. J'espère que ce sera utile à tous!