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.

Erstellen Sie eine responsive navbar, sidebar "Schublade" in der Bootstrap-4?

Anzahl der Antworten 2 Antworten
Versuchen, etwas zu erreichen wie diese : https://www.muicss.com/examples/v1/example-layouts/responsive-side-menu/index.html Ich habe gesehen, wie einige Beispiele online mit anderen Versionen von bootstrap, aber Sie alle ändern der css zu viel, das macht es schwieriger, zu lernen bootstrap. Ich Frage

Bootstrap 4 Sticky Footer Nicht Kleben

Anzahl der Antworten 5 Antworten
Nicht wirklich sicher, warum der sticky footer funktioniert nicht in der Bootstrap-4. Ich habe eine TYPO3-website, die ich bin ein Anfänger bei. Den sticky footer nicht kleben am unteren Rand der Seite. Hier ist eine Kopie der

So erhöhen Sie font-size in der Bootstrap-4?

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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?

Anzahl der Antworten 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?

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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?

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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?

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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?

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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

Anzahl der Antworten 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)

Anzahl der Antworten 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