Web Development Articles - Page 713 of 1049

Use the .initialism class in Bootstrap to show text inside an element. This allows setting smaller font size in Bootstrap −ExampleLive Demo           Bootstrap Example                                          Cricket          The ICC governs cricket boards.          The ICC was founded as the Imperial Cricket Conference in 1909          Above the ICC abbreviation text is displayed with a smaller font.          

Change the size of well using the optional classes such as, well-lg or well-lg. These classes are used in conjunction with .well class.You can try to run the following code to implement well-lg class in Bootstrap −ExampleLive Demo           Bootstrap Example                                 This has more space!       This has less space!    

To add information to the table row in Bootstrap, use the .info class in Bootstrap −ExampleLive Demo           Bootstrap Example                                          Rank of Cricketers          The following are the rank of cricketers:                                                         Cricketer                   Rank                                                                           Virat                   1                                                   David                   2                                                   Rohit                   3                                                   Kenn                   4                                                   Steve                   5                                                

Use the .in class in Bootstrap to fade in the tab.You can try to run the following code to fade in tab −ExampleLive Demo           Bootstrap Example                                          Tutorials Website          The following is our learning content:                       Home             About             Product                                                Home                This is demo text!                                        About                This is demo text!                                        Product                This is demo text!                                

To add hover color to background color of the table row, use the .active class in Bootstrap.ExampleLive Demo           Bootstrap Example                                          Student Information                                                         Student                   Subject                                                                           Tom                   Maths                                                   Amit                   Programming                                                   Steve                   Java                                                

To get a basic panel, just add class .panel to the element. With that, add class .panel-default to this element as in the following code −ExampleLive Demo           Bootstrap Example                                                       This is a demo panel                    

The panel-info class in Bootstrap is a contextual state class to form a panel more meaningful to a particular context. This adds information to a panel and is blue in color.You can try to run the following code to implement the panel-info class −ExampleLive Demo           Bootstrap Example                                                       Panel Title                                 This is a demo panel.                    

To make an element look like a heading, you can try to run the following code −ExampleLive Demo           Bootstrap Example                                          Planet          Earth          Asia          India          Hyderabad          Madhapur          

Use the .hidden-* class in Bootstrap to hide content depending on screen size with BootstrapExampleLive Demo           Bootstrap Example                                 This is visible.       This is hidden.       Hidden on small screen       Hidden on medium screen    

Use the .hidden class in Bootstrap to force an element to be hiddenExampleLive Demo           Bootstrap Example                                 This is visible.       This is hidden.