Bootstrap Dropdown Class

Lakshmi Srinivas
Updated on 12-Jun-2020 14:46:54

346 Views

Dropdown menus are toggleable, contextual menus for displaying links in a list format. To use a drop-down, just wrap the drop-down menu within the class .dropdown.You can try to run the following code to implement the dropdown class in BootstrapExampleLive Demo           Bootstrap Example                                                       Subjects                                                            Java                                        Data Mining                                                           C++                                                                    Separated link                                

Bootstrap Class Pull Right

Samual Sam
Updated on 12-Jun-2020 14:45:09

2K+ Views

Float an element to the right with class pull-right.You can try to run the following code to implement the pull-right classExampleLive Demo           Bootstrap Example                                          Float to right          

Create Block Level Button with Bootstrap

George John
Updated on 12-Jun-2020 14:43:49

329 Views

To create a block level button, use the .btn-block class.You can try to run the following code to add a block level button −ExampleLive Demo           Bootstrap Example                                       The following are block level buttons:                Block level Primary button                      Block level button          

Set Active State for Bootstrap Buttons

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          

Add Style to Images with Bootstrap

Samual Sam
Updated on 12-Jun-2020 14:41:30

751 Views

The following classes are provided by Bootstrap to add style to images: .img-rounded − adds border-radius:6px to give the image rounded corners. .img-circle − makes the entire image round by adding border-radius:500px. .img-thumbnail − adds a bit of padding and a gray borderYou can try to run the following code to add style to imagesExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap                      

Disable a Bootstrap Button

Ankith Reddy
Updated on 12-Jun-2020 14:40:12

2K+ Views

When you disable a button, it will fade in color by 50%, and lose the gradient. Use disabled to disable any button.To disable a button, you can try to run the following code −ExampleLive Demo           Bootstrap Example                                 The following are some buttons:                Default Button                      Active Button                      Disabled Button          

Make Image Round with Bootstrap

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

997 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          

img-rounded Class in Bootstrap

George John
Updated on 12-Jun-2020 14:37:56

321 Views

Use the img-rounded Bootstrap class to style your image and give it rounded corners:ExampleLive Demo           Bootstrap Images                                 Styling images with Bootstrap       Original Image             Rounded Image          

Image Thumbnail with Bootstrap

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

868 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          

Close Bootstrap Class

Samual Sam
Updated on 12-Jun-2020 14:34:22

278 Views

Use the generic close icon for dismissing content like models and alerts. Use the class close to getting the close icon.You can try to run the following code to implement a close Bootstrap classExampleLive Demo           Bootstrap Example                                 Close Icon:                       ×                    

Advertisements