J'ai appris les bootsap aujourd'hui et j'ai beaucoup gagné. Je partage un petit cas ici. Les explications spécifiques sont toutes dans le code, ce qui est plus intuitif.
Regardez d'abord la légende
<! Doctype html> <html lang = "zh-cn"> <éadf> <meta charset = "utf-8"> <meta name = "Viewport" contenu = "width = device-width, initial-scale = 1.0"> <itle> bootstrap tab </ title> <! - Initial-scale href = "css / bootstrap.min.css"> <link rel = "Stylesheet" type = "text / css" href = "css / bootstrap-responsive.min.css"> <link rel = Stylesheet "type =" text / css "href =" css / base.css "> </ head> <! Largeur du div à 940px et affichez au centre -> <div> <! - Hero-unnit set l'unité de vue de mise au point -> <div> <h1> Lenovo Holdings </h1> <p> <p> <img src = "img / bg2.png"> </p> <p> <a href = "#"> plus »</a> Grids, et chaque sous-div est réglé sur 4 grilles, c'est-à-dire 228px -> <div> <div> <h2> SUJETS DE LA SOCIÉTÉ </H2> <P> Le 2 décembre 2012, la Lenovo Star Entrepreneurship Lecture Hall a eu lieu à Changzho équipe". </p> <! - Style de bouton BTN -> <p> <a href = "#"> En savoir plus »</a> </p> </div> <div> <h1> Attention spéciale </h1> <p> de commencer par" vendre des ordinateurs "à l'intégration des cinq principaux actifs de l'informatique, de l'immobilier, de la consommation et des services modernes, de nouveaux matériaux et de 2014, 2016. </p> <p> <a href = "#"> Plus »</a> </p> </div> <v> <h1> Notre historique </h1> <p> <p> <a href =" # "> </a> </p> </v> 2013 </p> </ footer> </ div> <! - Présentation du fichier js de bootstrap -> <script type = "text / javascript" src = "js / jquery.min.js"> </ script> <script type = "text / javascript" src = "js / bootstrap.min.js"> </dcript> src = "js / bootstrap-tab.js"> </ script> </ body> </html> <! - introduisant le fichier de base.css -> / * Diagramme de style de mise au point * / div.hero-unit {/ * Style de fond, par défaut gris * / background: url (../ img / bg.png) no-repeat; Largeur: 980px; hauteur: 443px; Position: relative; / * Par défaut est 60px * / rembourrage: 0; / * Par défaut est 30px * / marge: 0; Border-Color: Gray;} div.hero-unit h1 {/ * Hide Title * / Affichage: Aucun;} / * Les annonces sont affichées dans le coin inférieur gauche * / div.hero-unit .banner {position: absolue; en bas: 0; gauche: 10px;} / * Les boutons sont affichés dans le coin inférieur droit * / div.hero-unit .btn {position: absolue; En bas: 14px; à droite: 20px;}Ce qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.