Karthikeya Boyini has Published 2193 Articles

Usage of Bootstrap navbar-form class

karthikeya Boyini

karthikeya Boyini

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

236 Views

To create navbar in CSS, use the navbar-form classExampleLive Demo           Bootstrap Example                                                       My Website                                                                                                  Submit                                

Bootstrap nav-pills class

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 16:17:34

226 Views

To turn the tabs into pills, use the class .nav-pills. You can try to run the following code to implement Bootstrap PillsExampleLive Demo           Bootstrap Example                                 Subjects                Java          WordPress          JavaScript          AngularJS          

Usage of Bootstrap Input Groups

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 16:10:02

136 Views

By adding prepended and appended content to an input field, you can add common elements to the user’s input. For example, you can add the dollar symbol, the @ for a Twitter username, or anything else that might be common for your application interface.ExampleYou can try to run the following ... Read More

Make a set of buttons appear vertically with Bootstrap

karthikeya Boyini

karthikeya Boyini

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

514 Views

The btn-group-vertical class makes a set of buttons appear vertically stacked rather than horizontally.You can try to run the following code to make a set of buttons appear vertically with a vertical button groupExampleLive Demo           Bootstrap Example                                          BCA          B.Tech                                      Masters                                                        MCA                MBA                M.Tech                M.COM                                

Align Dropdown to the right with Bootstrap

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 15:15:11

689 Views

To align dropdown to the right, add the class .pull-right to .dropdown-menu. You can try to run the following code to align dropdown to the rightExampleLive Demo           Bootstrap Example                                                       Cars                                                            BMW                                        Audi                                                           Hyundai                                                                           Mitsubishi                                                                           Nissan                                                

Bootstrap class dropdown-header

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 15:14:11

256 Views

Add a header to label sections of actions in any drop-down menu by using the class dropdown-header.You can try to run the following code to implement the dropdown-header Bootstrap classExampleLive Demo           Bootstrap Example                                                       Diet                                             Vegetables                            Potato                                        Tomato                                                           Brocolli                                         Fruits                                               Apple                                                                           Kiwi                                                

Bootstrap Button Group Classes

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 15:10:57

198 Views

Use the class .btn-group to work with Bootstrap Button Group Class. You can try to run the following code to form button groupExampleLive Demo           Bootstrap Example                                 The following are the buttons:                A          B          C          

Bootstrap class center-block

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 15:01:45

2K+ Views

Use class center-block to set an element to center.You can try to run the following code to implement the center-block classExampleLive Demo           Bootstrap Example                                          Float to right                                   Example for center-block                    

Set element to center with Bootstrap

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 14:55:02

976 Views

Use class center-block to set an element to center.You can try to run the following code to set the element to centerExampleLive Demo           Bootstrap Example                                                       Element at center                    

Make image round with Bootstrap

karthikeya Boyini

karthikeya Boyini

Updated on 12-Jun-2020 14:39:03

965 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 make an image roundExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap       Original Image             Rounded Image          

Advertisements