Mastering Bootstrap 4 - Second Edition电子书

Title Page

Copyright and Credits

Mastering Bootstrap 4 Second Edition

Packt Upsell

Why subscribe?

PacktPub.com

Contributors

About the authors

About the reviewer

Packt is searching for authors like you

Preface

Who this book is for

What this book covers

To get the most out of this book

Download the example code files

Conventions used

Get in touch

Reviews

Revving Up Bootstrap

Introducing our demo project

What Bootstrap 4 has to offer

Layout

Content styling

Components

Mobile support

Utility classes

Supported browsers

Sass instead of Less

From pixel to root em

Vendor prefix mixing

Icons

Themes

Customization

Setting up our project

Summary

Making a Style Statement

The grid system

Containers

Container

Container-fluid

Rows

Columns

Nesting

Auto-layout of columns

Alignment

Flex Order

Offsetting

Image elements

Responsive images

Image modifiers

Responsive utilities

Summary

Building the Layout

Creating sections

Adding Bootstrap components

Jumbotron

Tabs

Carousel

Cards

Navbar

Modals

Styling

Summary

On Navigation, Footers, Alerts, and Content

Fixating the navbar

More on navbar styling

Improving navigation using Scrollspy

Customizing scroll speed

Breadcrumbs

Icons

Using and customizing alerts

Creating a footer

Creating and customizing forms

Form validation

Progress indicators

Adding content using media objects

Figures

Quotes

Abbreviations

Summary

Speeding Up Development Using Third-Party Plugins

Browser detection

Enhanced pagination using bootpag

Displaying images using Bootstrap Lightbox

Improving our price list with DataTables

Typeahead

Tooltips

Popovers

Summary

Customizing Your Plugins

Anatomy of a plugin

JavaScript

Setup

Class definition

Data API implementation

jQuery

Sass

Customizing plugins

Customizing Bootstrap's jQuery alert plugin

The markup

Extending alert's style sheets

Extending alert's functionality with JavaScript

Customizing Bootstrap's jQuery carousel plugin

The markup

Extending carousel's functionality with JavaScript

Extending carousel's style sheets

Writing a custom Bootstrap jQuery plugin

The idea – the A11yHCM plugin

The a11yhcm.js file

The markup

Adding some style

Summary

Advanced Third-Party Plugins

Building a testimonial component with Salvattore

Introducing Salvattore

Adding Animate.css to MyPhoto

Bouncing alerts

Animating a Salvattore grid

Hover

Adding Hover to MyPhoto

Making the navbar grow

Awesome Hover icons

Salvattore Hover

Summary

Utilities

Flexbox

Display properties and alignment

Display helpers

Alignment helpers

Borders

Context colors

Margins and padding

Floating

Fixing

Toggling visibility

Text alignment and transformation

Highlighting text

Reducing text size

Lists

Unstyled lists

Inline lists

Width and height

Code

Sub and sup

Formatting user input

Formatting user output

Clearfix

Summary

List Groups and Accordions

List groups

Interacting with list items

Applying badges

Applying context classes

Collapsing content

Accordions

Summary

Optimizing Your Website

CSS optimization

Inline styles

Long identifier and class names

Shorthand rules

Grouping selectors

Rendering times

Minifying CSS and JavaScript

Introducing Grunt

Minification and concatenation using Grunt

Running tasks automatically

Stripping our website of unused CSS

Processing HTML

Deploying assets

Stripping CSS comments

JavaScript file concatenation

Summary

Integrating with AngularJS and React

Introducing AngularJS

Setting up AngularJS

Improving the testimonials component

Making testimonials dynamic

Making a Promise with $q

Creating an AngularJS directive

Writing the testimonials template

Testing the testimonial directive

Importing the Salvatorre library

Introducing React

Setting up React

Making a Gallery component in React

Using carousel in React

Summary

Other Books You May Enjoy

Leave a review - let other readers know what you think