Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Bootstrap Articles
Page 2 of 49
Container for embedded content in Bootstrap
Use the .embed-responsive class in Bootstrap to set a container for embedded content.You can try to run the following code to implement the .embed-responsive class in BootstrapExample Bootstrap Example Add pages in WordPress To add pages on a WordPress, try the below given steps in the video:
Read MoreCreate Two Columns with Two Nested Columns in Bootstrap
To create two columns in two nested columns, you can try to run the following code −Example Bootstrap Example Nested Columns Column1 nested column nested column Column2
Read MoreChange the order of the Bootstrap grid columns
Use the .col-*-pull-* and .col-*-push-* classes in Bootstrap to change the order of the Bootstrap grid columns −Example Bootstrap Example Bootstrap Example 1 Right Left
Read MoreHow to use the Glyphicons icons in Bootstrap
To use the Glyphicons icon in Bootstrap, use the following code just about anywhere in your code. Leave a space between the icon and text for proper padding like −Example Bootstrap Example You can try to run the following code to implement the Glyphicons icons:Example Bootstrap Example The following are the icons:
Read MoreBootstrap Collapsible in
The collapsible in class in Bootstrap is used to display the collapsible content.You can try to run the following code to implement the collapsible in class −Example Bootstrap Example Quiz Click below to toggle the button content. More Quizzes We have quizzes on Java, PHP, Ruby, Quantitative Aptitude, ASP.net, etc.
Read MoreBootstrap 4 .border-danger class
Use the border-danger class to set a red border to an element.Set the border-danger class to an element as if we include any other class − Red Border Above, we have also set another class “new”, to style the element − .new { width: 120px; height: 120px; margin: 20px; } You can try to run the following code to implement the border-danger class −Example Bootstrap Example .new { width: 120px; height: 120px; margin: 20px; } Rectangle with red border: Red Border
Read Morebg-light class for Bootstrap 4 cards
To set a light grey background for the Bootstrap 4 cards, use the bg-light class.Use “card bg-light” like any other class in Bootstrap − Image Editor The above gives a light grey background to the Bootstrap card.Let us see an example of the card-light class −Example Bootstrap Example Web Tools Image Editor Image Optimizer
Read MoreBootstrap 4 .justify-content-*-end class
To justify the flex items on the end, use the justify-content-end class.To justify the flex items on the end, on different screen sizes, use the justify-content-*-end class. The flex items justified at the end would be visible like the following on different screen sizes −Small Screen Size Alabama New York Texas Medium Screen Size Alabama New York Texas Let us see the complete code and learn how to work with justify-content-*-end class −Example Bootstrap Example US Alabama New York Texas Alabama New York Texas Alabama New York Texas
Read MoreBootstrap 4 .card-img-bottom class
Use the card-img-bottom class in Bootstrap 4 to place an image at the bottom inside a Bootstrap 4 card.Set the card body, and within that, the card title and card text − Quantitative Aptitude For Entrance Exams Sample Questions Now set image with class “card-img-bottom”−Let us see an example to learn how to implement Bootstrap 4 .card-img-bottom class −Example Bootstrap Example Quantitative Aptitude Questions Answers Quantitative Aptitude For Entrance Exams Sample Questions
Read MoreBootstrap shown.bs.tab event
The shown.bs.event fires when the tab is completely displayed. After that the alert generates as shown below −$('.nav-tabs a').on('shown.bs.tab', function(){ alert('New tab is now visible!'); });The tabs are displayed using the show() method −$(".nav-tabs a").click(function(){ $(this).tab('show'); });You can try to run the following code to implement the shown.bs.tab event −Example Bootstrap Example Topic Home ...
Read More