🎓 EASYTUTORGUIDE

Practical tutorials, tools, courses, digital skills, and business promotion.

★ Free Learning
Translate this lesson:
Persian and Arabic automatically enable Bootstrap RTL CSS. Long translated content remains responsive; code stays LTR.

Bootstrap 5.3.8 • 60 Chapters

Complete Bootstrap Course

Complete Bootstrap 5.3.8 course with 60 chapters covering responsive layout, grid, utilities, forms, components, JavaScript plugins, Sass, CSS variables, color modes, accessibility, RTL, Google Translate resilience, performance, and production patterns.

Chapter 1: Bootstrap Overview and Setup

What Bootstrap Provides, Bootstrap 5.3.8, CDN Setup, npm Setup, HTML Starter Template

Open chapter

Chapter 2: Containers

container, container-fluid, Responsive Containers, Container Padding, Choosing a Container

Open chapter

Chapter 3: Grid Fundamentals

Rows and Columns, 12-Column Grid, Auto-Layout Columns, Column Widths, Nested Grids

Open chapter

Chapter 4: Responsive Columns

col-sm, col-md, col-lg, col-xl, col-xxl

Open chapter

Chapter 5: Grid Gutters

g-* Utilities, gx-* Horizontal Gutters, gy-* Vertical Gutters, No Gutters, Responsive Gutters

Open chapter

Chapter 6: Breakpoints and Mobile-First Design

Bootstrap Breakpoints, Mobile-First CSS, Breakpoint Infixes, Responsive Utility Strategy, Testing Across Viewports

Open chapter

Chapter 7: Display Utilities

d-none, d-block, d-inline, d-flex, Responsive Display

Open chapter

Chapter 8: Flex Utilities

Flex Direction, Flex Wrap, Justify Content, Align Items, Auto Margins

Open chapter

Chapter 9: Spacing Utilities

Margin Utilities, Padding Utilities, Start and End Spacing, Responsive Spacing, Gap Utilities

Open chapter

Chapter 10: Sizing and Overflow Utilities

Width Utilities, Height Utilities, Viewport Sizing, Overflow Utilities, Object Fit Utilities

Open chapter

Chapter 11: Typography

Headings, Display Headings, Lead Text, Text Alignment, Text Wrapping

Open chapter

Chapter 12: Images and Figures

img-fluid, img-thumbnail, Rounded Images, figure, figure-caption

Open chapter

Chapter 13: Tables

table, Table Variants, Striped and Hover Rows, Table Borders, Responsive Tables

Open chapter

Chapter 14: Color and Background Utilities

Text Colors, Background Colors, Text Background Helpers, Opacity Utilities, Subtle Colors

Open chapter

Chapter 15: Borders Shadows and Radius

Border Utilities, Border Color, Border Radius, Shadow Utilities, Responsive Border Patterns

Open chapter

Chapter 16: Buttons

btn Classes, Button Variants, Outline Buttons, Button Sizes, Disabled Buttons

Open chapter

Chapter 17: Button Groups

btn-group, Vertical Button Groups, Button Toolbars, Nested Dropdown Buttons, Accessible Button Groups

Open chapter

Chapter 18: Forms Overview

form-control, Form Labels, Form Text, Disabled Forms, Read-Only Controls

Open chapter

Chapter 19: Form Controls

Text Inputs, Textarea, File Inputs, Form Control Sizing, Plain Text Controls

Open chapter

Chapter 20: Select Menus

form-select, Select Sizing, Multiple Select, Disabled Select, Accessible Select Labels

Open chapter

Chapter 21: Checks Radios and Switches

form-check, Checkboxes, Radio Buttons, Switches, Inline Checks

Open chapter

Chapter 22: Range Inputs

form-range, Range Min Max, Range Step, Disabled Range, Range Labels

Open chapter

Chapter 23: Input Groups

input-group, Text Addons, Button Addons, Multiple Inputs, Input Group Sizing

Open chapter

Chapter 24: Floating Labels

form-floating, Floating Text Inputs, Floating Textareas, Floating Selects, Input Groups with Floating Labels

Open chapter

Chapter 25: Form Layout

Grid Forms, Row and Column Forms, Horizontal Forms, Responsive Form Layout, Form Spacing

Open chapter

Chapter 26: Form Validation

Validation Classes, Browser Validation, Custom Feedback, Server-Side Validation States, Accessible Validation

Open chapter

Chapter 27: Navs

nav, nav-tabs, nav-pills, Fill and Justify, Responsive Navs

Open chapter

Chapter 28: Navbar

navbar, Navbar Brand, Navbar Toggler, Navbar Collapse, Responsive Navbar

Open chapter

Chapter 29: Breadcrumbs and Pagination

breadcrumb, Breadcrumb Dividers, pagination, Pagination States, Responsive Pagination

Open chapter

Chapter 30: Cards

card, Card Body, Card Header and Footer, Card Images, Responsive Card Layout

Open chapter

Chapter 31: List Groups

list-group, Active and Disabled Items, Flush Lists, Numbered Lists, List Group Links

Open chapter

Chapter 32: Alerts and Badges

alert, Dismissible Alerts, badge, Pill Badges, Contextual Status Patterns

Open chapter

Chapter 33: Progress and Spinners

progress, Stacked Progress, spinner-border, spinner-grow, Accessible Loading Status

Open chapter

Chapter 34: Placeholders

placeholder, Placeholder Width, Placeholder Animation, Card Placeholders, Loading Skeleton Patterns

Open chapter

Chapter 35: Accordion and Collapse

accordion, Accordion Items, Always-Open Accordion, collapse, Multiple Collapse Targets

Open chapter

Chapter 36: Dropdowns

dropdown, Dropdown Alignment, Dropup and Dropend, Dropdown Dividers, Responsive Dropdown Menus

Open chapter

Chapter 37: Modals

modal, Modal Sizes, Scrollable Modals, Vertically Centered Modals, Static Backdrop

Open chapter

Chapter 38: Offcanvas

offcanvas, Offcanvas Placement, Responsive Offcanvas, Offcanvas Scrolling, Offcanvas Backdrop

Open chapter

Chapter 39: Carousel

carousel, Carousel Indicators, Carousel Controls, Carousel Captions, Responsive Carousel Images

Open chapter

Chapter 40: Tabs and Pills with JavaScript

Tab Plugin, Pill Plugin, Tab Content, Fade Transitions, Accessible Tab Markup

Open chapter

Chapter 41: Tooltips

Tooltip Setup, Tooltip Placement, Tooltip HTML, Disabled Elements, Tooltip Disposal

Open chapter

Chapter 42: Popovers

Popover Setup, Popover Placement, Popover Content, Dismissible Popovers, Popover Disposal

Open chapter

Chapter 43: Toasts

toast, Toast Container, Toast Placement, Autohide, Accessible Toasts

Open chapter

Chapter 44: Scrollspy

Scrollspy Setup, Navigation Targets, Nested Navigation, Smooth Scrolling, Scrollspy Events

Open chapter

Chapter 45: Position and Helper Utilities

position Utilities, top start bottom end, translate-middle, stretched-link, visually-hidden

Open chapter

Chapter 46: Utility API

Utility API Basics, Responsive Utilities, State Utilities, Print Utilities, RTL Utility Options

Open chapter

Chapter 47: Sass Customization

Sass Variables, Maps, Mixins, Import Order, Custom Bootstrap Build

Open chapter

Chapter 48: CSS Variables

Bootstrap CSS Variables, Component Variables, Local Variables, Runtime Theming, Custom Property Fallbacks

Open chapter

Chapter 49: Color Modes

data-bs-theme, Dark Mode, Component Color Modes, Theme Toggle, Custom Color Modes

Open chapter

Chapter 50: Accessibility

Semantic HTML, Keyboard Interaction, Focus Indicators, Color Contrast, Reduced Motion

Open chapter

Chapter 51: Bootstrap RTL

RTL Stylesheet, dir and lang, Start and End Utilities, RTL Components, RTL Testing

Open chapter

Chapter 52: Google Translate Responsive Hardening

Detecting Arabic and Persian, Switching Bootstrap RTL CSS, Long Translated Labels, Preventing Horizontal Overflow, Keeping Code LTR

Open chapter

Chapter 53: Responsive Navigation Patterns

Collapsing Navbar, Offcanvas Navigation, Responsive Utility Menus, RTL Mobile Navigation, Long Translation Navigation

Open chapter

Chapter 54: Responsive Tables Forms and Media

table-responsive, Responsive Form Grids, Fluid Images, Responsive Embeds, Translated Form Labels

Open chapter

Chapter 55: Installation and Delivery

CDN with SRI, npm Install, Compiled Files, Source Files, Version Pinning

Open chapter

Chapter 56: Bootstrap JavaScript API

Data Attributes, Programmatic Components, Events, getInstance and getOrCreateInstance, Dispose Methods

Open chapter

Chapter 57: Performance and Selective Loading

Bundle vs Individual Plugins, Reducing CSS, Lazy Media, Avoiding Layout Shift, Production Asset Caching

Open chapter

Chapter 58: Application Layout Patterns

Dashboard Layout, Course Page Layout, Marketing Page Layout, Settings Page Layout, Responsive Admin Layout

Open chapter

Chapter 59: Debugging Bootstrap

DevTools Classes, Breakpoint Debugging, Specificity Conflicts, JavaScript Plugin Debugging, RTL and Translation Debugging

Open chapter

Chapter 60: Production Checklist

Responsive Review, Accessibility Review, RTL and Translation Review, Performance Review, Deployment Verification

Open chapter