Bootstrap

Bootstrap

by Jake Spurlock
Released May 2013
Publisher(s): O'Reilly Media, Inc.
ISBN: 9781449344597

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Discover how easy it is to design killer interfaces and responsive websites with the Bootstrap framework. This practical book gets you started building pages with Bootstrap’s HTML/CSS-based tools and design templates right away. You’ll also learn how to extend your app with interactive features, using its suite of jQuery plugins—often without writing a single line of code.

Developed by Twitter and available free from GitHub, Bootstrap supports responsive design by dynamically adjusting your web page layout. With just a basic knowledge of HTML, CSS, and JavaScript, you can build apps that work equally well on desktop screens, smartphones, and tablets. This book shows you how.

  • Become familiar with Bootstrap’s file structure, grid systems, and container layouts
  • Learn HTML elements for typography, code, tables, forms, buttons, images, and icons
  • Design interfaces and other web elements, such as navigation, breadcrumbs, and custom modal windows
  • Use jQuery plugins for features such as revolving slideshows, tabbable interfaces, and dropdown menus
  • Modify everything from column count to typography colors with the LESS stylesheet language

Table of contents

  1. Bootstrap
  2. Foreword
  3. Preface
    1. Who This Book Is For
    2. Who This Book Is Not For
    3. What This Book Will Do For You
    4. How This Book Works
    5. Why I Wrote This Book
    6. Other Resources
    7. Are You Sure You Want Bootstrap?
    8. Conventions Used in This Book
    9. Using Code Examples
    10. Help This Book Grow
    11. Safari® Books Online
    12. How to Contact Us
    13. Acknowledgments
  4. 1. Bootstrap Scaffolding
    1. What Is Bootstrap?
    2. Bootstrap File Structure
    3. Basic HTML Template
    4. Global Styles
    5. Default Grid System
      1. Basic Grid HTML
      2. Offsetting Columns
      3. Nesting Columns
    6. Fluid Grid System
    7. Container Layouts
    8. Responsive Design
      1. What Is Responsive Design?
        1. Helper classes
  5. 2. Bootstrap CSS
    1. Typography
      1. Headings
      2. Lead Body Copy
      3. Emphasis
      4. Bold
      5. Italics
      6. Emphasis Classes
        1. Abbreviations
        2. Addresses
        3. Blockquotes
      7. Lists
        1. Unordered list
        2. Ordered list
        3. Definition list
    2. Code
    3. Tables
      1. Optional Table Classes
        1. Striped table
        2. Bordered table
        3. Hover table
        4. Condensed table
      2. Table Row Classes
    4. Forms
      1. Optional Form Layouts
        1. Search form
        2. Inline form
        3. Horizontal form
      2. Supported Form Controls
        1. Inputs
        2. Textarea
        3. Checkboxes and radio buttons
        4. Selects
      3. Extended Form Controls
        1. Prepended and appended inputs
      4. Form Control Sizing
        1. Relative input controls
        2. Grid sizing
        3. Uneditable text
        4. Form actions
        5. Help text
      5. Form Control States
        1. Input focus
        2. Disabled input
        3. Validation states
    5. Buttons
      1. Button Sizes
      2. Disabled Button Styling
    6. Images
    7. Icons
      1. GLYPHICONS Attribution
      2. Usage
        1. Button groups
        2. Navigation
  6. 3. Bootstrap Layout Components
    1. Dropdown Menus
      1. Options
        1. Right-align
        2. Submenu
    2. Button Groups
      1. Button Groups as Radio Buttons and Checkboxes
    3. Buttons with Dropdowns
      1. Split Button Dropdowns
      2. Dropup Menus
    4. Navigation Elements
      1. Tabular Navigation
      2. Basic Pills Navigation
        1. Disabled class
      3. Stackable Navigation
      4. Dropdowns
      5. Navigation Lists
        1. Horizontal divider
      6. Tabbable Navigation
        1. Tab position
    5. Navbar
      1. Navbar Links
      2. Forms
      3. Navbar Menu Variations
        1. Fixed top navbar
        2. Fixed bottom navbar
        3. Static top navbar
        4. Responsive navbar
        5. Inverted navbar
    6. Breadcrumbs
    7. Pagination
      1. Pager
    8. Labels
    9. Badges
    10. Typographic Elements
      1. Hero Unit
      2. Page Header
    11. Thumbnails
    12. Alerts
    13. Progress Bars
    14. Media Object
    15. Miscellaneous
      1. Wells
      2. Helper Classes
        1. Pull left
        2. Pull right
        3. Clearfix
  7. 4. Bootstrap JavaScript Plugins
    1. Overview
      1. Programmatic API
    2. Transitions
    3. Modal
      1. Usage
      2. Options
      3. Methods
        1. Options
        2. Toggle
        3. Show
        4. Hide
      4. Events
    4. Dropdown
      1. Usage
      2. Dropdown Usage via JavaScript
      3. Method
    5. Scrollspy
      1. Usage
        1. Usage via JavaScript
      2. .scrollspy('refresh') Method
      3. Options
      4. Event
    6. Toggleable Tabs
      1. Usage
      2. Events
    7. Tooltips
      1. Usage
      2. Options
      3. Methods
        1. Options
        2. Show
        3. Hide
        4. Toggle
        5. Destroy
    8. Popover
      1. Usage
      2. Options
      3. Methods
        1. Options
        2. Show
        3. Hide
        4. Toggle
        5. Destroy
    9. Alerts
      1. Usage
      2. Close Method
      3. Events
    10. Buttons
      1. Loading State
      2. Single Toggle
      3. Checkbox Buttons
      4. Radio Buttons
      5. Usage
      6. Methods
        1. Toggle
        2. Loading
        3. Reset
        4. String
    11. Collapse
      1. Usage
        1. Via data attributes
        2. Via JavaScript
      2. Options
      3. Methods
        1. Options
        2. Toggle
        3. Show
        4. Hide
      4. Events
    12. Carousel
      1. Usage
      2. Options
      3. Methods
        1. Options
        2. Cycle
        3. Pause
        4. Number
        5. Prev
        6. Next
      4. Events
    13. Typeahead
      1. Usage
      2. Options
    14. Affix
      1. Usage
      2. Option
  8. 5. Using Bootstrap
    1. GitHub Project
    2. Customizing Bootstrap
      1. Using LESS
      2. Text Snippets
      3. Photoshop Templates
      4. Themes
    3. Built with Bootstrap
    4. Conclusion
  9. Index
  10. About the Author
  11. Colophon
  12. Copyright

Product information

  • Title: Bootstrap
  • Author(s): Jake Spurlock
  • Release date: May 2013
  • Publisher(s): O'Reilly Media, Inc.
  • ISBN: 9781449344597