Nancy Den has Published 290 Articles

Align labels and groups of form controls in a horizontal layout with Bootstrap

Nancy Den

Nancy Den

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

2K+ Views

Use the .form-horizontal class in Bootstrap to align labels and groups of form controls in a horizontal layout.You can try to run the following code to implement .form-horizontal class:ExampleLive Demo           Bootstrap Example                                                       Name                                             Name                                Submit          

Bootstrap Panel with List groups

Nancy Den

Nancy Den

Updated on 12-Jun-2020 20:31:32

584 Views

Include list groups within any panel. Create a panel by adding class .panel to the element. Also, add class .panel-default to this element. Now within this panel include your list groups.You can try to run the following code to set panel with list groups −ExampleLive Demo     ... Read More

How to use Bootstrap Affix Plugins

Nancy Den

Nancy Den

Updated on 12-Jun-2020 19:08:01

276 Views

The affix plugin allows a to become affixed to a location on the page. You can also toggle it's pinning on and off using this plugin.The affix plugin toggles between three classes, each representing a particular state − .affix, .affix-top, and .affix-bottom. Follow the below steps to set your ... Read More

Set Bootstrap Panel with Heading

Nancy Den

Nancy Den

Updated on 12-Jun-2020 18:15:50

309 Views

Follow the below steps to set Bootstrap panel with heading −Use .panel-heading class to add a heading container to your panel.Use any - with a .panel-title class to add a pre-styled heading.You can try to run the following code for panel with headings in Bootstrap −ExampleLive Demo     ... Read More

Usage of Bootstrap navbar-fixed-top class

Nancy Den

Nancy Den

Updated on 12-Jun-2020 16:59:13

386 Views

Use the Bootstrap class .navbar-fixed-top to set the navbar fixed to the top.You can try to run the following code to fix navbar to the top −ExampleLive Demo           Bootstrap Example                                                       Modes of Transport                                                Air Transport                Water Transport                                

Usage of Bootstrap navbar-fixed-bottom class

Nancy Den

Nancy Den

Updated on 12-Jun-2020 16:57:54

367 Views

To fix navbar to the bottom, use the navbar-fixed-bottom class.You can try to run the following code to implement navbar-fixed-bottom class −ExampleLive Demo           Bootstrap Example                                                       Java Topics                                                Basics                Interface                Polymorphism                Encapsulation                                

Bootstrap btn-group-vertical class

Nancy Den

Nancy Den

Updated on 12-Jun-2020 15:46:59

157 Views

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

Form Layouts in Bootstrap

Nancy Den

Nancy Den

Updated on 12-Jun-2020 13:31:34

258 Views

The following are the form layouts provided by Bootstrap −Vertical formThe basic form structure comes with Bootstrap; individual form controls automatically receive some global styling.In-line formTo create a form where all of the elements are inline, left aligned and labels are alongside, add the class .form-inline to the tagHorizontal ... Read More

What is the syntax for leading bang! in JavaScript function?

Nancy Den

Nancy Den

Updated on 12-Jun-2020 09:31:51

179 Views

To execute an anonymous function you need to use the leading bang! or any other symbol −!function(){    // do stuff }();You can also write it like −+function(){    // do stuff }();Even the following is an acceptable syntax −~function(){    // do stuff    return 0; }( );

Animate transform property with CSS Animation

Nancy Den

Nancy Den

Updated on 12-Jun-2020 08:50:49

198 Views

To implement animation on transform property with CSS, you can try to run the following code −ExampleLive Demo                    div {             margin: auto;             border: 2px solid blue;             width: 300px;             height: 400px;             background-color: orange;             animation: myanim 3s;          }          @keyframes myanim {             30% {                transform: rotate(120deg);             }          }                                    Demo          

Advertisements