Tag: bootstrap-4
Bootstrap-4 ist die vierte große version des beliebten front-end-Komponente-Bibliothek. Das Bootstrap-framework unterstützt das erstellen von responsive, mobile-first Webseiten und web-apps.
So erhöhen Sie font-size in der Bootstrap-4?
2 Antworten
In der Bootstrap-4, schriftart,-Größe standardmäßig mit em oder rem für Schriftarten. Wie erhöhe ich die font-size für alle viewport-Größen? Da jedes element sieht winzig. Wenn Sie möchten ansprechende schriftart, die Größen, die Sie verwenden können media queries.
Bootstrap navbar-fixed-top-Klasse, nicht zu arbeiten
2 Antworten
Aufbau einer portfolio-Website mithilfe des Bootstrap - ich bin die Anwendung der "navbar-fixed-top" - Klasse, um die navbar zu bleiben, um den oberen Rand des Fensters, wie in diesem Beispiel: https://getbootstrap.com/examples/navbar-fixed-top/ Ich versuche zu tun, also mit
Bootstrap-4 Carousel Mehrere Bilder auf einmal und schieben Sie durch eine
2 Antworten
Andere Frage auf der gleichen Notwendigkeit (diese Frage) für bootstrap-3, aber die vorgeschlagenen Lösungen funktionieren nicht mit Bootstrap 4. Dem Bild von diesem post erklärt sehr gut, was ich will. Und noch mehr diese bootply. Wie kann
Stil Bootstrap 4 Benutzerdefinierte Kontrollkästchen
4 Antworten
Wie kann ich eine Formatvorlage benutzerdefinierte Kontrollkästchen in der Bootstrap-4? Ich habe alles versucht, aber ich kann auch nicht ändern seine Hintergrundfarbe. Dies ist mein code-Gliederung: HTML: <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> <label class="custom-control custom-checkbox"> <input type="checkbox"
Die Verwendung von verschiedenen Schriftarten in der Bootstrap-4?
5 Antworten
Ich bin ein Neuling. Ich weiß, ich kann vergeben Sie unterschiedliche Schriftarten für die Bootstrap-4, wie dieser Standard, font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; Was ich wissen will, wenn ich versuche, eine website
Wie zu installieren und zu verwenden, öffnen Sie-Ikone mit bootstrap 4 beta mit CDN-Bibliothek?
2 Antworten
Habe ich unten aufgeführt <!-- Bootstrap 4.0 Beta --> <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha256-m/h/cUDAhf6/iBRixTbuc8+Rg2cIETQtPcH9D3p2Kg0=" crossorigin="anonymous" /> <!-- open-iconic-bootstrap (icon set for bootstrap) --> <link href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" /> Und verwendet diese wie unten mit kein Glück <span class="oi oi-icon-person"
Suche Eingang mit einem Symbol Bootstrap 4
5 Antworten
Keine Ahnung, wie ich dies tun kann, da BS 4 nicht unterstützt glyphicons. Kann ich es einrichten als hintergrund oder bewerbe ich mich in verschiedenen Positionen zu einem font-awesome-icon? Dies ist mein code bisher: HTML: <link rel="stylesheet"
Um Spalten durch Bootstrap4
6 Antworten
Ich habe 3 Spalten, die ich will, um in unterschiedlicher Weise auf desktop-und Mobilgeräten. Derzeit ist meine Stichelei sieht so aus: HTML: <div class="row"> <div class="col-xs-3 col-md-6"> 1 </div> <div class="col-xs-3 col-md-6"> 2 </div> <div class="col-xs-6 col-md-12">
Bootstrap-4 Klapp-Karte - Abgehackte Animationen
3 Antworten
Ich bin mit Bootstrap 4 und haben eine Karte mit einem .Karte-Kopf-und .Karte-block etwa so: <div class="card"> <div class="card-header"> <a data-toggle="collapse" href="#test-block" aria-expanded="true" aria-controls="test-block"> card header </a> </div> <div id="test-block" class="card-block"> card block </div> </div> Ich möchte
Tut bootstrap-4 verfügen über einen eingebauten horizontalen Trennbalken?
7 Antworten
Tut bootstrap-4 verfügen über einen eingebauten horizontalen Trennbalken? Ich kann dies tun, <style type="text/css"> .h-divider{ margin-top:5px; margin-bottom:5px; height:1px; width:100%; border-top:1px solid gray; } </style> Aber ich wollen, verwenden Sie die integrierte in der bootstrap-css, ich kann es
Bootstrap 4 ungültige Rückmeldung mit Eingang Gruppe nicht anzeigen
4 Antworten
Bin ich auf der Suche in die Bootstrap-4 - beta, die allerdings, wenn Sie .is-invalid mit .input-group es scheint nicht zu zeigen, bis. HTML: <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet" /> <div class="form-group"> <label for="label">Label</label> <div class="input-group"> <div class="input-group-addon"> label
Wie verwenden von CSS position klebrig zu halten, eine Seitenleiste sichtbar mit Bootstrap 4
4 Antworten
Ich habe zwei Spalten-layout wie dieses: <div class="row"> <div class="col-xs-8 content"> </div> <div class="col-xs-4"> </div> </div> Wenn ich die position:sticky auf die sidebar-Spalte, bekomme ich die klebrige Verhalten der sidebar: https://codepen.io/marcanuy/pen/YWYZEp CSS: .sticky { position: sticky; top:
Bootstrap-4, fügen Sie ein Leerzeichen zwischen zwei Karten-decks
2 Antworten
Ich versuche, fügen Sie ein Leerzeichen zwischen den beiden Karten-decks. Ich bin mit bootstrap-4 alpha 6. Ich habe keine Ahnung, warum mt-20 auf die zweite Karte auf dem deck es nicht tun. Ich habe versucht, wickeln Sie
name kann nur die URL-freundliche Zeichen
3 Antworten
Ich versuche das Paket zu installieren.json mit npm init zu installieren bootstrap in meinem Ordner, aber ich bin immer der Fehler. npm install [email protected] --save Ich bin neu in diesem, ich kann nicht genau herauszufinden, was ich
Bootstrap-4 multiselect dropdown
1 Antworten
Ich lese in vielen Foren, dass das problem von select-und multiselect behoben wurde, nachdem die beta-version von bootstrap 4. Leider bin ich nicht in der Lage, um die Anzeige der Mehrfachauswahl wie in (bootstrap 3) in (bootstrap
popper.js in der bootstrap-4 gibt SyntaxError Unerwartetes token exportieren
5 Antworten
Habe ich versucht zu installieren, bootstrap 4, und nahmen die folgenden links <script src="libs/jquery/dist/jquery.min.js"></script> <script src="libs/tether/dist/js/tether.min.js" ></script> <script src="libs/popper.js/dist/popper.js"></script> <script src="libs/bootstrap/dist/js/bootstrap.min.js" ></script> Aber Der folgende Fehler tritt auf : Uncaught syntaxError: Unexpected token exportieren Irgendwelche Ideen wie
Vertikal ausrichten Bootstrap-badge innen überschrift
2 Antworten
Wenn ich mit einem Bootstrap - badge im inneren der Position wie h1,h2,h3 ist die vertikale Ausrichtung aus. Die badge richtet nach unten von dem text der überschrift. Ich würde gerne das Abzeichen ausrichten vertikal zentriert mit
Bootstrap-Reihe mit Säulen unterschiedlicher Höhe
4 Antworten
Ich habe derzeit so etwas wie: <div class="row"> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> </div> Nun davon aus, dass content war Boxen verschiedener Höhe, mit
Wie man Header-Karte Keine Border-Radius-in der Bootstrap-4?
5 Antworten
Kann die Karte-header haben keine border-radius auf bootstrap 4? Ich habe implementiert, diese ABER die Hintergrundfarbe der Karte-header überschneidungen der Karte-header, also die Karte-header haben noch border-radius .card-header { height: 50px; background-color: #000; border-bottom-color: #fff; border-top: none;
Bootstrap-4 navbar-inverse muss nicht Farbe
3 Antworten
Vor kurzem habe ich beschlossen, zu versuchen, neue bootstrap-version (4). Ich habe alles richtig mit Dateien (meine html unten) <!DOCTYPE html> <html lang="pl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Bootstrap 4 website</title> <link
Bootstrap-4-Formular Validierung mit Javascript /jQuery
1 Antworten
Ich bin neu in web-Entwicklung, und die versuche zum einrichten einer Praxis-form zu lernen, Formular-Validierung. Ich bin nach Bootstrap ist doc für Benutzerdefinierte Stile zu behandeln diejenigen, die mit Fragen der Zugänglichkeit, die Bildschirmleseprogramme verwenden und zu
Bootstrap-4 Multi-Carousel zeigt 4 Bilder anstatt 3
1 Antworten
Ich kann nicht herausfinden, wie man es zeigen 4 Bilder anstatt 3. Basierend auf diesem Code: Bootstrap 4 Mehrere Artikel, Karussell Script JS $('#recipeCarousel').carousel({ interval: 10000 }) $('.carousel .carousel-item').each(function(){ var next = $(this).next(); if (!next.length) { next
Mega dropdown-Menü mit bootstrap 4
1 Antworten
Ich versuche, Sie zu reproduzieren Codepen , in der Bootstrap-4. Den folgenden Codepen ist, wo ich kam (Dropdown mit 2 Spalten), helfen meine Anleitungen im Netz. Navbar HTML <nav class="navbar navbar-expand-lg navbar navbar-dark bg-primary"> <a class="navbar-brand" href="#">Navbar</a>
Bootstrap-vue wird nicht geladen, CSS
3 Antworten
Schreibe ich eine Vue.js app mit Bootstrap 4 und ich kann es nicht geladen obwohl ich folgte der Dokumentation. Hinzugefügt main.js Vue.use(BootstrapVue); Hinzugefügt css-Datei im Zusammenhang mit App.vue: @import '../../node_modules/bootstrap/dist/css/bootstrap.css'; @import '../../node_modules/bootstrap-vue/dist/bootstrap-vue.css'; Hier ist die Vorlage: <div
Warum Glyphe Symbole abgenommen wurden, in der bootstrap-4
1 Antworten
In bootstrap 3 haben wir die schriftart verwenden, die wir verwenden können glyph-Symbole, aber in der bootstrap-4 gab es keine Schrift und Symbol Symbole können nicht verwendet werden. Ich will wissen, warum Sie nahm Glyphe Symbol und
Bootstrap-4 mit remote-Modal
5 Antworten
Kann ich nicht machen, der Modal-arbeiten Sie im remote-Modus mit der neuen Twitter Bootstrap Version : Bootstrap-4 alpha. Es funktioniert einwandfrei mit Bootstrap 3. Mit bootstrap-4, erhalte ich das popup-Fenster, aber das Modell Körper nicht immer geladen.
Wie positioniert Karussell Indikatoren in der Bootstrap-4
2 Antworten
Ich versuche die Indikatoren unter dem Schieberegler, indem Sie .carousel-indicators eine bottom: -50px; aber die Indikatoren einfach zu verschwinden. Nun, ich vermute, das hat etwas zu tun mit der overflow:hidden von dem regler, aber ich kann T
Make table-header fixiert beim scrollen
0 Antworten
Ich bin mit Bootstrap V4 alpha 6 zusammen mit Angular 5 erstellen Sie eine Tabelle mit festen header beim scrollen. Allerdings kann ich nicht scheinen, um es zu arbeiten. Hinweis: Die navbar ist fixed-top Dinge, die ich
Bootstrap-4 toggle-button
2 Antworten
Baue ich ein einfaches Fahrzeug-Inspektion form, und ich möchte Kontrollkästchen verwenden, wie die Tasten zu erfassen true/false Werte. Dies ist eigentlich trivial sein mit Bootstrap 4. Ich würde aber gerne einstellen das Standard-Verhalten des buttons; zum Umschalten
Twitter Bootstrap Collapse-plugin-Richtung—Horizontale statt Vertikale
7 Antworten
Gibt es eine Möglichkeit zu reduzieren, die Bootstrap Collapse-plugin von horizontal statt vertikal? Blick auf den code, der diese Fähigkeit scheint nicht gebaut werden, aber ich hoffe, ich bin nur etwas fehlt... Jede Hilfe wird sehr geschätzt.
bootstrap 4 richten Sie die Schaltflächen in der Mitte
3 Antworten
im ein wenig stecken, wie center richten Sie eine Schaltfläche der Gruppe i haben: <section> <div class="d-inline mx-auto"> <a class="btn btn-outline-primary" href="#">Home</a> <a class="btn btn-outline-primary" href="#">Traffic</a> <a class="btn btn-outline-primary" href="#">MAC Monitoring</a> <a class="btn btn-outline-primary" href="#">Alert Logging</a> <a
Fehlende peer-Abhängigkeiten
2 Antworten
Ich bin neu npm - und Winkel-Projekte, und ich bin mit [email protected] in meinem package.json. Wenn ich das mache npm installieren, bekomme ich folgende Fehlermeldung - [email protected] requires a peer of [email protected] - 3 but none is
Webpack Installieren Bootstrap - fehlende popper.js.anzeigen
5 Antworten
Folgte ich den Anweisungen in https://getbootstrap.com/docs/4.0/getting-started/webpack/ und ich auch installiert werden, und jquery popper.js mit npm. Immer noch, wenn ich den Ausgang bundle.js der browser sendet weiterhin Anfragen BEKOMMEN für popper.js.Karte und ich muss alle Vermögenswerte, die
Bootstrap-Raster mit HTML5-Abschnitte und Beiseite
0 Antworten
Ich bin mit dem Bootstrap-4-raster-system, und wollen zu schweben Sie übrigens auf der rechten Seite des Bildschirms. Derzeit mein MAIN Inhalt ist verpackt in col-xl-3, ich will die BEISEITE auch col-xl-3, aber ich will es ausführen, die
Ändern Bootstrap-4-Karussell-Steuerelement Farben
0 Antworten
Ich bin mit einem weißen hintergrund für ein Karussell mit Bootstrap 4.0 und möchten, ändern Sie die Farbe der Bedienelemente. Es scheint, dass bootstrap verwendet jetzt die SVG für Ihre Karussell-Symbole. Dies bedeutet, dass die änderung der
Offene Bootstrap-4 Modal via JavaScript durch klicken auf einen link
2 Antworten
Möchte ich zum öffnen eines modalen wenn ich auf einen link klicken. Leider konnte ich nicht ändern Sie den HTML-Code der link. Ich konnte nur ändern Sie den Inhalt href. Wie diese: <a href="#Modal">Open modal</a> Konnte ich
Horizontale Form: Text-Eingabe neben label nicht funktioniert
3 Antworten
Ich versuche, das label in der gleichen Zeile wie das Textfeld in einem Bootstrap-4 horizontale form. Scheint nicht zu funktionieren. Die Textfelder immer in die nächste Zeile. Jede Hilfe wird sehr geschätzt. <div class="form-group form-group-sm col-sm-6"> <label
Wie kann ich das ändern Linkfarbe und hover-Farbe in der Bootstrap-version 4?
6 Antworten
In meinem design, die ich ändern will ist mein link und hover-Farbe in einem bestimmten Teil. Ich versuche mein bestes, aber ich kann das nicht tun. Ich bin neu in der bootstrap. Wie kann ich es ändern,
Bootstrap-4 hex-Farben für rails-app
1 Antworten
Weiß jemand, wo finden Sie eine Liste von bootstrap-4 Farben in hex? ich schaute auf die docs, vielleicht habe ich es verpasst? Mein Problem ist, dass ich bin versucht, einige Farben auf meiner Website, um die bootstrap-4
Bootstrap-4 - Mitte-Liste
2 Antworten
Baue ich eine app mit der Bootstrap-4-beta. Diese app ist wirklich einfach in dem moment und hat einen einzigen inline-Liste. Ich versuche, die Mitte dieser Liste horizontal in der Mitte des Bildschirms. Wie in diesem Bootply, dachte
So ändern Sie die Deckkraft der Karte-block-bootstrap 4
6 Antworten
Hey ich habe nur eine einfache Karte Bootstrap-4-Komponente. <div class="card"> <div class="card-header">This is my header</div> <div class="card-block">This is my block</div> <div class="card-footer">This is my footer</div> </div> Was ich erreichen wollte war, die Kopf-und Fußzeile mit einer Deckkraft
Zusammenbruch nicht in der ng-bootstrap-und Winkel-4-app für Navigation breadcrumb-Schaltfläche
3 Antworten
Ich bin mit Winkel-4 und bootstrap-4-beta-2 und ng-bootstrap für meine Bewerbung und auch mit ng-bootstrap. Habe ich die navbar von bootstrap-Dokumentation Beispiel. Der code sieht so aus: <nav class="navbar navbar-expand-lg navbar-light bg-light"> <a class="navbar-brand" href="#">Navbar</a> <button class="navbar-toggler"
label und Eingabe in derselben Zeile auf dem Formular-Gruppe
3 Antworten
Ich habe ein Formular-Gruppe mit einem label und input <div class="col-md-12 form-group"> <label class="col-sm-2 col-form-label" for="name">Name</label> <input type="text" class="form-control" name="name" id="name" [(ngModel)]="person.name" disabled/> </div> Aber das label zeigt über dem Eingabefeld, muss ich es an seiner Seite.
Bootstrap - align-Taste auf der Unterseite der Karte
3 Antworten
War ich spähen in einem der Bootstrap-Beispiele für die card-deck und card Klassen (Pricing B.). Ich fragte mich, wie kann man fix die Schaltfläche Ausrichtung, wenn Sie eine der Listen, hat weniger Elemente als die anderen. Ich
Bootstrap-4-Karte/panel mit dem Bild Links im header und Titel
1 Antworten
Dachte ich, was ich bin versucht zu tun, wäre ziemlich einfach zu tun, aber ich kann einfach nicht damit es funktioniert. Habe ich versucht zu tun, pull-Links auf die bootstrap-Karten und Tafeln und es nicht so funktioniert,
Bootstrap-4 Feste Spitze nav und Feste Seitenleiste
2 Antworten
Dies ist ein großartiges Beispiel dafür, wie man erstellen Sie eine Navigationsleiste mit einer sidebar. Kann mir jemand den code ändern, so dass die top-nav ist oben fixiert und der sidebar Feste/statische nur mit dem Inhalt der
Ausrichten Sie Schaltfläche auf der rechten Seite eine "Karte" mit Bootstrap v4
2 Antworten
Ich bin neu auf Bootstrap und dachte, ich würde Tauchen Sie mit Ihrem v4-alpha-Version. Ich versuche, richten Sie die 'Ordnen Sie eine Bewertung" Knopf (in der Nähe unten auf der Seite) in dem folgenden Beispiel auf der
Die Zentrierung der navbar-Inhalte in der Bootstrap-4 (alpha 5)
2 Antworten
Ich versuche, um die Mitte der navbar-Inhalte in der Bootstrap-4, alpha 5. Ich habe ein wenig googeln, und ich denke, es könnte einige trick mit d-block und mx-auto. Allerdings kann ich nicht herausfinden, wie um die Mitte
Ändern Bootstrap-4 checkbox-Hintergrundfarbe
1 Antworten
Frage ich mich, wie kann ich das ändern Bootstraps 4 Kontrollkästchen Hintergrundfarbe auf dieses Beispiel. Vielen Dank! <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous"> <style> .custom-control-label::before, .custom-control-label::after { top: .8rem; width: 1.25rem; height: 1.25rem; } </style> <div class="custom-control form-control-lg custom-checkbox">
Bootstrap-4 Glyphicons zeigt nicht auf Eckige 4-Projekt
0 Antworten
Arbeite ich an einer Eckigen 4-Projekt mittels Bootstrap-4 mit Sass, und ich will die glyphicons, aber wenn ich den folgenden code verwenden: <button class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-thumbs-up"></span>Like</button> Zum Beispiel, wenn ein "gefällt mir" - button, der