Found 641 Articles for CSS Framework

sr-only Bootstrap class

George John
Updated on 12-Jun-2020 14:53:35

421 Views

Hide an element to all devices except screen readers with the class .sr-only.You can try to run the following code to implement the sr-only Bootstrap −ExampleLive Demo           Bootstrap Example                                                                      Email address                                                        Password                                                

Hide content with Bootstrap

Chandu yadav
Updated on 12-Jun-2020 14:56:09

390 Views

To hide content with Bootstrap, use the .hidden class in Bootstrap. You can try to run the following code to hide content:ExampleLive Demo           Bootstrap Example                                                       Content is visible.                                 Content is hidden.                    

Show content with Bootstrap

Samual Sam
Updated on 12-Jun-2020 14:57:56

211 Views

To show content with Bootstrap, use the .show class in Bootstrap. You can try to run the following code to make content visibleExampleLive Demo           Bootstrap Example                                                       Content is visible.                                 Content is hidden.                    

Bootstrap class center-block

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                    

Bootstrap class pull-left

Ankith Reddy
Updated on 12-Jun-2020 15:00:44

574 Views

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

Close Bootstrap class

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

254 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:                       ×                    

Image Thumbnail with Bootstrap

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

820 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          

Make image round with Bootstrap

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

962 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          

Add style to images with Bootstrap

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

708 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          

Advertisements