Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
To animate a striped progress bar, use the .active class with the .progress-bar class in Bootstrap.You can try to run the following code to animate a striped progress barExampleLive Demo Bootstrap Example Level The level of water in meters: 20%
To set the width of an element to 50%, use the .w-50 class in Bootstrap.You can try to run the following code to set element’s width −ExampleLive Demo Bootstrap Example Set element width Normal width Width is 50%
Use the .shadow-none class in Bootstrap to remove shadow.You can try to run the following code to remove an element’s shadow −ExampleLive Demo Bootstrap Example Learning Learn Tutorials for free Play Quiz and check your knowledge
Use the .shadow-sm class in Bootstrap 4 to add a small shadow to an element.You can try to run the following code to implement the shadow-sm class in BootstrapExampleLive Demo Bootstrap Example Learning Try programming examples Learn from Tutorials Play Quiz and check your knowledge
To create a filter list, use the .list-group class in Bootstrap.You can try to run the following code to create a filter list −ExampleLive Demo Bootstrap Example Tutorials Java jQuery PHP AngularJS Ruby C $(document).ready(function(){ $("#demo").on("keyup", function() { var value = $(this).val().toLowerCase(); $("#newList li").filter(function() { $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1) }); }); });
The media object is to make the code for developing blocks of information drastically shorter.You can try to run the following code to implement media objectsExampleLive Demo Bootstrap Example Media heading This is some sample text. This is some sample ... Read More
To filter a table in Bootstrap, you can try to run the following code −ExampleLive Demo Bootstrap Example Students Rank Name Marks Rank Amit 94 1 Tom 90 2 Steve 88 3 Chris 80 4 Corey 79 5 Glenn 75 6 $(document).ready(function(){ $("#demo").on("keyup", function() { var value = $(this).val().toLowerCase(); $("#test tr").filter(function() { $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1) }); }); });
The following are the classes available for responsive utility classes in Bootstrap −ClassesDevices.visible-xsExtra small (less than 768px) visible.visible-smSmall (up to 768 px) visible.visible-mdMedium (768 px to 991 px) visible.visible-lgLarger (992 px and above) visible.hidden-xsExtra small (less than 768px) hidden.hidden-smSmall (up to 768 px) hidden.hidden-mdMedium (768 px to 991 px) hidden.hidden-lgLarger (992 px and above) hidden
To create a Bootstrap media list in Bootstrap, you can try to run the following code −ExampleLive Demo Bootstrap Example Media heading ... Read More
A well is a container in that causes the content to appear sunken or an inset effect on the page. To create a well, simply wrap the content that you would like to appear in the well with a containing the class of .well.You can try to run the following code to implement well class in Bootstrap −ExampleLive Demo Bootstrap Example This is demo text!