- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 700 Articles for Bootstrap
107 Views
To set an outline on a button that indicates information, you need to use the btn-outline-info class in Bootstrap.Include the button element and set the btn-outline-info class − More Info You can try to run the following code to implement the btn-outline-info class −ExampleLive Demo Bootstrap Example Event The following are the details: Event Timings 1PM TO 4PM Venue: 21 KH, HG Lane, Alabama For more information about the event: More Info
82 Views
Add key stuff to a Bootstrap card, using the bg-primary class with the card class.Use the bg-primary class in the card class − Eisner Award I have used the text-white class above, to set the text to be white.Let us see a example how to include key stuff in a Bootstrap 4 card −ExampleLive Demo Bootstrap Example Awards The Pulitzer Prize Eisner Award Hugo & Nebula Awards
927 Views
To align a flex item in the center with Bootstrap 4, use the .align-self-center class.The following is my div for flex −Now add flex items and here I have applied the align-self-center class on the 3rd flex item − A-one B-one C-one D-one You can try to run the following code to implement the align-self-center class in Bootstrap −ExampleLive Demo Bootstrap Example Align Specific Flex Item in the center A-one B-one C-one D-one
481 Views
Use the card-link class to add a hover effect and blue color to any link in a card.The following is a code snippet showing three links with hover effect using the card-link class in Bootstrap 4 − Website Development App Development (iOS) App Development (Android) Try the following code to implement the card-link class −ExampleLive Demo Bootstrap Example Services Company We provide the following tech development services: Website Development App Development (iOS) App Development (Android)
291 Views
To set a light grey background for the Bootstrap 4 cards, use the bg-light class.Use “card bg-light” like any other class in Bootstrap − Image Editor The above gives a light grey background to the Bootstrap card.Let us see an example of the card-light class −ExampleLive Demo Bootstrap Example Web Tools Image Editor Image Optimizer
10K+ Views
Use the float-right class in Bootstrap to place an element on the right.The default text alignment is on the left and use the float-right class to align text on the right as in the following code snippet − This text is on the right. It can be used on any other element as well, for example, , , etc − On the right You can try to run the following code to implement the float-right class −ExampleLive Demo Bootstrap Example Example This text is on the right. This text is on the left. Float Removed
57 Views
To align gathered items from the start, use the .align-content-start class in Bootstrap 4.Set the items as shown below − Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 You can try to run the following code to implement the align-content-start in Bootstrap 4 −ExampleLive Demo Bootstrap Example Align Flex Items Work 1 Work 2 Work 3 Work 4 Work 5 Work 6 Work 7 Work 8 Work 9 Work 10 Work 11 Work 12 Work 13 Work 14
127 Views
Use the btn-outline-light class in Bootsrap 4 to set light grey outlined button.To include it on the web page, set it as a class in the element as shown in the following code snippet −Let us see an example to implement the btn-outline-light class −ExampleLive Demo Bootstrap Example Demo Button Below is a light grayed outline button: Sample
69 Views
To set blue outlined Bootstrap 4 button, use the .btn-outline-primary class.Add a blue outline to a button − Blue outline You can try to run the following code to implement the btn-outline-primary class in Bootstrap −ExampleLive Demo Bootstrap Example Bootstrap 4 You can see blue outline below: Blue outline
381 Views
Use the card-header class to create header of a Bootstrap card − This is the header After including the card header, you can add the card body and footer as shown in the following code snippet − This is demo content. This is the footer. You can try to run the following code to implement the card-header class in Bootstrap 4 −ExampleLive Demo Bootstrap Example Demo Heading This is the header This is demo content. This is the footer