Lakshmi Srinivas has Published 260 Articles

Customize links using the active class to indicate the current page

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 17:19:14

164 Views

You can customize links using the active class to indicate the current page.You can try to run the following code to customize links using the active classExampleLive Demo           Bootstrap Example                                 Elements                «          e1          e2          e3          e4          »          

Align the components with Bootstrap

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 17:11:08

382 Views

To align the components like nav links, forms, buttons, or text to left or right in a navbar using the utility classes .navbar-left or .navbar-right. Both classes will add a CSS float in the specified direction.ExampleYou can try to run the following code to align componentsLive Demo     ... Read More

Usage of Bootstrap navbar-btn class

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 16:35:15

548 Views

Add buttons using class .navbar-btn to elements not residing in a to vertically center them in the navbar. .navbar-btn can be used on and elements.You can try to run the following code to implement the navbar-btn classExampleLive Demo           Bootstrap Example                                                       Search below:                                                                                                  Submit Button                         Navbar Button                    

Pills with Dropdowns Bootstrap Example

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 16:16:28

235 Views

To form pills with dropdowns, you can try to run the following exampleExampleLive Demo           Bootstrap Example                                 Website                Home          About                                      Products                                                        Online Compiler                Image Editor                                Services          Contact          

Use dropdowns with any button size using Bootstrap

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 15:52:38

153 Views

Use btn-large, .btn-sm, or .btn-xs class to use dropdowns with any button size.Let us see an example of btn-largeExampleLive Demo           Bootstrap Example                                                       Default                                                 Action             Another action             Something else here                         Separated link                    

Img-circle Bootstrap class

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 15:08:13

567 Views

Use the img-circle Bootstrap class to style your image and make it completely round.You can try to run the following code to implement the img-circle classExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap       Original Image             Image with Rounded Corners          

Clear the float of an element with Bootstrap

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 14:59:29

623 Views

To clear the float of an element, use the .clearfix Bootstrap class.ExampleYou can try to run the following code to clear float of an elementLive Demo           Bootstrap Example                                                       left                                 right                    

Set active state for Bootstrap Buttons

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 14:42:29

2K+ Views

To set the active state for Bootstrap Buttons, use the .active class.The button will appear pressed as in the following codeExampleLive Demo           Bootstrap Example                                 The following are some buttons:                Default Button                      Active Button          

Image Thumbnail with Bootstrap

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 14:37:14

887 Views

To add a thumbnail to the image, use the .img-thumbnail Bootstrap class.You can try to run the following code to add a thumbnail to imagesExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap       Original Image             Thumbnail Image          

Create button in Bootstrap

Lakshmi Srinivas

Lakshmi Srinivas

Updated on 12-Jun-2020 14:31:50

223 Views

To create a Bootstrap Button, you can try to run the following buttonExampleLive Demo           Bootstrap Example                                             Result    

Advertisements