Bootstrap ist ein sehr beliebtes Front-End-Framework. Einfach ausgedrückt ist es ein Werkzeugsatz für HTML, CSS und JavaScript. Wir können Bootstrap verwenden, um eine einfache und frische Website oder Software -Oberfläche zu erstellen. Mit Bootstrap müssen Back-End-Entwickler sich keine Sorgen mehr machen, die Front-End-Schnittstelle zu erstellen.
Bootstrap (1) enthält eine Fülle von Webkomponenten, basierend auf diesen Komponenten können Sie schnell eine schöne und voll funktionsfähige Website erstellen. Es enthält die folgenden Komponenten: Dropdown-Menü, Schaltflächengruppe, Schaltfläche Dropdown-Menü, Navigation, Navigationsleiste, Brotkrumen, Paging, Typensatz, Miniaturansichten, Warndialoge, Fortschrittsbalken, Mediendialoge usw.
(2) Es wird mit 13 JQery -Plugins geliefert, die den Komponenten in Bootstrap das Leben verleihen. Dazu gehören: Modus-Dialogfelder, Registerkarten, Bildlaufleisten, Popup-Boxen usw.
Bootstrap wurde in ihrer Freizeit von Twitter -Ingenieuren entwickelt. Nach der Eröffnung der Quelle auf der größten und beliebtesten Open -Source -Website wurde Xunsu das am häufigsten aktualisierte Projekt auf der Website. Eine große Anzahl von Ingenieuren hat aktiv Code zum Projekt beigetragen, und eine große Anzahl von Websites, die mit Bootstrap erstellt wurden, entstanden in kurzer Zeit. Warum ist die Entwicklungsgeschwindigkeit von Bootstrap so erstaunlich? Dies ist hauptsächlich auf die hervorragenden Merkmale von Bootstrap zurückzuführen:
Mobile Geräte werden bevorzugt: Mobile orientierte Funktionen zuerst einsetzen
Browserunterstützung: Alle Mainstream -Browser unterstützen Bootstrap
Einfacher Einstieg: Solange Sie die Grundlagen von HTML und CSS haben, können Sie mit dem Lernen von Bootstrap beginnen
Responsives Design: Das Responsive CSS von Bootstrap ist an Desktops, Tablets und Mobiltelefone anpassbar.
Es enthält leistungsstarke integrierte Komponenten für eine einfache Anpassung
Werfen wir einen Blick auf die einfachste Seite, die mit Bootstrap erstellt wurde.
<! DocType html> <html Lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta http-äquiv = "x-ua-compatible" content = "ie = edge"> <meta name = "viewPort" content = "width = tempel-width, initial-scale Bootstrap-> <link href = "css/bootstrap.min.css" rel = "styleSheet"> <!-html5 shim und reagieren.js ie8 Support von html5-Elementen und Medienfragen-> <!-Warnung: reagieren.js funktioniert nicht, wenn Sie die Seite über die Seite sehen: //-> <! src = "http://cdn.bootcs.com/html5shiv/3.7.2/html5shiv.min.js"> </script> <script src = "http://cdn.bootcs.com/respect.js/1.4.2/respecture.min.js"> <! [endif]-> </head> <body> <div> <Viv> <h1> Mein erster Bootstrap-Seite </h1> <p> Reset der Fenstergröße. </p> </div> <div> <div> <h3> Spalte 1 </h3> <p> Was Sie lernen, ist nicht nur Technologie, sondern auch Traum! </p> <p> Egal wie großartig Ihr Traum ist, es kann Ihrer idiotischen Ausdauer nicht standhalten! </p> </div> <div> <h3> Spalte 2 </h3> <p> Was Sie lernen, ist nicht nur Technologie, sondern auch Traum! </p> <p> Egal wie großartig Ihr Traum ist, es kann Ihrer idiotischen Ausdauer nicht standhalten! </p> </div> <div> <h3> Spalte 3 </h3> <p> Was Sie lernen, ist nicht nur Technologie, sondern auch Traum! </p> <p> Egal wie großartig Ihr Traum ist, es kann Ihrer idiotischen Ausdauer nicht standhalten! </p> </div> </div> </div> </body> </html>
Der oben genannte ist der erste Artikel über das Erlernen von Bootstrap, das Ihnen vom Herausgeber vorgestellt wurde. Ich hoffe, es wird Ihnen hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird Ihnen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!