bootstrap-4

问题 Silly question: Working with Bootstrap v4.0. How can we put 'hamburger' items on the right side, instead of left side? Basically, I want this, just opposite sides Another example: I need items to be just under 'hamburger', not on the left side: I looked on http://getbootstrap.com/docs/4.0/components/navbar/, Bootstrap 4 navbar items on right side, Collapse button on right side of navbar in bootstrap 4 Everybody talks about items in regular navbar. But what about items in collapsed navbar?

问题 Silly question: Working with Bootstrap v4.0. How can we put 'hamburger' items on the right side, instead of left side? Basically, I want this, just opposite sides Another example: I need items to be just under 'hamburger', not on the left side: I looked on http://getbootstrap.com/docs/4.0/components/navbar/, Bootstrap 4 navbar items on right side, Collapse button on right side of navbar in bootstrap 4 Everybody talks about items in regular navbar. But what about items in collapsed navbar?

问题 I don't know what to do with Bootstrap 4, and how to show multiple small images –like thumbnails– in one slide, as opposed to have the images fill the width of the carousel. I've tried a couple things with the code below, but still can't stack many images. <div class="container"> <h2 class="text-center">- Carousel -</h2><br> <div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="carousel-item active"> <img src="http://via

问题 I don't know what to do with Bootstrap 4, and how to show multiple small images –like thumbnails– in one slide, as opposed to have the images fill the width of the carousel. I've tried a couple things with the code below, but still can't stack many images. <div class="container"> <h2 class="text-center">- Carousel -</h2><br> <div id="carouselExampleControls" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="carousel-item active"> <img src="http://via

问题 I am developing an application with Angular 4, Bootstrap 4 and ngbootstrap. The html code - <div class="container"> <form [formGroup]="myForm" novalidate (ngSubmit)="save(myForm.value)"> <div class="form-group"> <div class="row"> <legend class="col-form-legend col-sm-2">Required</legend> <div class="btn-group col-sm-2" ngbRadioGroup name="isRequired" formControlName="isRequired"> <label ngbButtonLabel class="btn-primary"> <input ngbButton type="radio" name="radio" [value]="true">Yes </label>

问题 Currently the page looks like this: Now on resize to mobile screen flex boxes overflow the container: Html: <div id="bars" class="d-flex flex-row text-white text-center"> <div class="port-item p-4 bg-primary" data-toggle="collapse" data-target="#home"> <i class="fa fa-home d-block"></i> Home </div> <div class="port-item p-4 bg-success" data-toggle="collapse" data-target="#resume"> <i class="fa fa-graduation-cap d-block"></i> Resume </div> <div class="port-item p-4 bg-warning" data-toggle=

问题 What is the correct way to import bootstrap in Angular 6. In previous versions I did it this way and it worked correctly. angular-cli.json (Angular 5) "styles": [ "styles.scss" ], "scripts": [ "../node_modules/jquery/dist/jquery.slim.min.js", "../node_modules/popper.js/dist/umd/popper.min.js", "../node_modules/bootstrap/dist/js/bootstrap.min.js" ], angular.json (Angular 6) "styles": [ "src/styles.css" ], "scripts": [ "../node_modules/jquery/dist/jquery.slim.min.js", "../node_modules/popper.js

问题 I have been trying to use ng-bootstrap in my Angular 2 project following the documentation on the ng-bootstrap official site. What I have done are as follow: npm install bootstrap@4.0.0-alpha.4 Navigate to the root /bootstrap directory and run npm install to install local dependencies listed in package.json. Navigate to the root project again and run npm install --save @ng-bootstrap/ng-bootstrap After that, I import in the module as follows: import { BrowserModule } from '@angular/platform

问题 Hi I have been stuck on what seems like this simple problem for a while going back and forth through SO solutions does not seem to fit my use case exactly... I have an angular component which has a template containing bootstrap nav pills, these are just being used as tabs within this particular screen. So I have a Search tab and a results tab and after performing a search I want to activate the results tab but I can't work out how to hook into the bootstrap tabs from the component. The

问题 I want to add the card lift effect to my bootstrap cards with fluent design styles on hover. You can see what I mean on microsoft design website. Here's what I tried, but there is something missing and I cannot quite grab it. I tried: .card { box-shadow: -3px 6px 5px 0px rgba(176,164,176,1); transition: all .3s ease-in-out; } .card:hover { box-shadow: -3px 18px 20px 0px rgba(99,89,99,1); } <div class="card" style="width:19.5rem"> <div class="card-body"> Lorem ipsum dolor sit ameta, card