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
Web Development Articles
Page 190 of 801
Bootstrap 4 .btn-outline-success Button class
Use the btn-outline-success class in Bootstrap to set green outline to a button.Green button outline states success and you can set a button like this − Result Above I have set the class on element just like we set a class on any other element in HTML or Bootstrap.Here is an example to learn how to work with the btn-outline-success class in Bootstrap −Example Bootstrap Example Result The following are the subjects: Maths Digital Electronics For result, click below: Result
Read MorePlace an element in the middle of the parent element in Bootstrap 4
Use align-middle class to place an element in the middle of the parent element.To place an element in the middle − Middle Alignment Let us seen an example to implement the align-middle class in Bootstrap 4 −Example Bootstrap Example Example This is demo text Demo Baseline Top Alignment Middle Alignment Bottom Alignment
Read Moreshown.bs.tooltip event in Bootstrap
The shown.bs.tooltip event in Bootstrap fires when the tooltip is completely displayed:$("[data-toggle='tooltip']").on('shown.bs.tooltip', function(){ alert('Tooltip is completely visible now.'); });The data-toggle attribute above is set on a link, wherein the popup will originate on button click as shown in the following code snippet: Timings You can try to run the following code to implement the shown.bs.tooltip event −Example Bootstrap Example Event Here tooltip will be displayed using the "Show" ...
Read MoreStyle Bootstrap 4 card with bg-primary class
Use the bg-primary class in Bootstrap 4, to add important stuff to a card and set blue background color.Style the Bootstrap 4 card as in the following code snippet − Medical Books I have set the body of the card in the card-body class − Medical Books To implement the bg-primary class in Bootstarp 4, you can try to run the following code −Example Bootstrap Example Books History Books Medical Books
Read MoreSet positive success action with green outlined Bootstrap 4 Button
To set an outline on a button that indicates positive action, you need to use the btn-outline-success class in Bootstrap.Here is how you can set it: More (Green Outline) You can try to run the following code to implement the btn-outline-success class −Example Bootstrap Example Python The following are the Python Technologies : Jython WxPython For more, click below: More (Green Outline)
Read MoreAlign gathered items at the end in Bootstrap 4
Use .align-content-end class to align gathered items at the end in Bootstrap 4.To set the items at the end −
Read MoreBootstrap hide.bs.tooltip event
The hide.bs.tooltip event in Bootstrap fires when the tooltip is about to be hidden.Click the hide button first −$(".btn-default").click(function(){ $("[data-toggle='tooltip']").tooltip('hide'); });On clicking above the hide.bs.tooltip event fires and an alert generates −$("[data-toggle='tooltip']").on('hide.bs.tooltip', function(){ alert('Tooltip will hide now.'); });You can try to run the following code to implement the hide.bs.tooltip event −Example Bootstrap Example Event Here tooltip will be displayed using the "Show" buttpn and can be hidden using ...
Read MoreDark grey outlined Bootstrap 4 Button
To set dark grey outlined border to a button, use the btn-outline-dark class.Include the brn-outline-dark class as if you add any other class to an element. Here, we have the button element since we want a dark grey outline for our button: Dark gray outline Let us see an eample to implement the btn-outline-dark class in Bootstrap −Example Bootstrap Example Bootstrap 4 Learning btn-outline-dark class usage: Dark gray outline
Read MoreBootstrap 4 Button .btn-outline-primary class
The btn-outline-primary class is used in Bootstrap 4 to set blue outlined button.Add blue outline to the button using the btn-outline-primary class as shown in the following code snippet − Result You can try to run the following code to implement the btn-outline-primary class −Example Bootstrap Example Result Click below to get the result: Result
Read MoreContainer to create a grid of Bootstrap 4 cards
Create a grid of cards with Bootstrap 4, using the card-columns class.Set the grid inside the class − Include the card body inside the card container as in the following code snippet. I have added the card body under the card-class. The card-class is added inside the card-columns class − Accessories Let us see an example to create a grid of cards in Bootstrap −Example Bootstrap Example Products Accessories Furnitures
Read More