Learning Bootstrap 3 - Tutorial From Infinite Skills

Explore Bootstrap documentation across the CSS section, grid system, components, and JavaScript, and learn how glyph icons, dropdowns, nav bars, pagination, breadcrumbs, transitions, and modals power modern UI.

Identify bootstrap 3 breakpoints at 768, 990, and 1200 pixels and learn how media queries adjust CSS for extra small, tablet, and desktop layouts to create a responsive design.

Build a responsive Bootstrap navigation bar with a header and branding linking to home, featuring an active home link and a toggleable menu for small screens.

Learn to add a blog quote block in Bootstrap, remove surrounding spaces, and display the author in a small tag, then adjust the info panel color with CSS.

Add left and right navigation to a Bootstrap 3 image carousel, implement carousel indicators, and handle slide targeting with data attributes and active states for responsive controls.

Activate the index page in the menu and set up a two-column Bootstrap grid inside a container and row, with the main content spanning eight columns and a sidebar.

Add a Bootstrap pagination component to the blog page by creating an ordered list with list elements, marking the current page, and including left and right arrows at the bottom.

Build a right sidebar search box with Bootstrap 3 input groups, featuring a magnifying glass icon and placeholder, plus an end-of-input button.

Create a collapsible panel group using bootstrap 3, configure panel headings and accordions with unique collapse IDs, and use clickable links with data-toggle='collapse' to open and close each panel.

Customize Bootstrap by selecting only needed components and plugins, starting with the full download and trimming print styles, code formatting, and unused features to create a lean, deployable build.