With visibility utilities you have control the visibility, without modifying the display, of elements.
Tag: bootstrap components
Bootstrap utilities : “Vertical align”
Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.
Change the alignment of elements with the vertical-alignment utilities.
These are the classes:- .align-baseline, .align-top, .align-middle, .align-bottom, .align-text-bottom, and .align-text-top as needed.
Bootstrap: Components & Utilities
Bootstrap:-Component “Navigation bar”
The navbar is one of the prominent features of Bootstrap sites. A navigation bar is a navigation header that is placed at the top of the page. the navigation bar can extend or collapse, depending on the screen size. A standard navigation bar is created with the .navbar class.
Format of nav bar:-
- Vertical Navbar by using class=”navbar-nav”.
- Centered Navbar by using .justify-content-center class to center the navigation bar.
- Colored Navbar by using any of the .bg-color classes to change the background color of navbar.
- Brand/Logo by using .navbar-brand class is used to highlight the brand/logo/project name of your page.
- Collapsing The navbar To create a collapsible navigation bar, use a button with class=”navbar-toggler”, data-toggle=”collapse” and data-target=”#thetarget”.
- Navbar With Dropdown.
- Navbar Froms and Buttons Add a <form> element with class=”form-inline” to group inputs and buttons side-by-side.
- Nevbar Text use .navbar-text class to vertically align any elements inside the navbar that are not links.
- Fixed Navbar by using .fixed-top or .fixed-bottom class to make the navbar fixed.
- Sticky navbar use the .sticky-top class to make the navbar fixed/stay at the thop of the page.
Bootstrap:-Component “Input group”
Input group:-
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Functions:-
- Sizing classes to the .input-group itself and contains within will automatically resize for each element.
- Checkboxes and radios options within an input group’s addon instead of text.
- Multiple inputs are only available for input gropus with a single inpute.
- Multiple addons are supported and can be mixed with checkbox and radio input versions and many more others things as well.
- Button addons are supported and can be mixed with multiple buttons and input text.
- Buttons with dropdowns are needed within a single line inpute.
- Segmented buttons means button and then inside button a dropdown menu and text area there.
- Customer forms button area and an option area.
- Customer file input are most important for uploading a file or image etc.