Practical Bootstrap : learn to develop responsively with one of the most popular CSS frameworks /
Learn to use one of the most popular CSS frameworks and build mobile-friendly web pages. Used for numerous websites and applications, Bootstrap is a key tool for modern web development. You will explore the grid system and then be introduced to the power of Bootstrap in practical projects. Youll mak...
Clasificación: | Libro Electrónico |
---|---|
Autor principal: | |
Formato: | Electrónico eBook |
Idioma: | Inglés |
Publicado: |
[Berkeley, CA] :
Apress,
[2020]
|
Temas: | |
Acceso en línea: | Texto completo (Requiere registro previo con correo institucional) |
Tabla de Contenidos:
- Intro
- Table of Contents
- About the Author
- About the Technical Reviewer
- Introduction
- Chapter 1: Getting Started
- Learning Goals
- Bootstrap Defined
- The Bare-Bones Twitter Bootstrap Page
- Containers
- Grid System
- Example: One Row with 12 Columns
- Example: Two-Row Grid, the Second with Six Columns
- Example: Two-Row Grid, the Second with Five Columns
- Example: Two-Row Grid, the Second Having Three Columns, with the Middle Wider
- Different Display Widths
- Tasks and Quizzes
- Key Takeaways
- Chapter 2: Advanced Grid Techniques
- Learning Goals
- Introduction
- Basic Bootstrap Page with a Navigation Bar
- Adding a Dropdown Menu
- Jumbotron
- Headers with Horizontal Lines: Page Headers
- Buttons
- Tables
- Basic Bootstrap Tables
- Styling Bootstrap Tables
- Coloring Table Rows
- Labels and Badges
- Labels
- Badges
- Key Takeaways
- Chapter 5: Theme Reference: Part 2
- Learning Goals
- Introduction
- Tabs
- The Tab Headers
- The Tab Information
- Checkpoint
- Alerts
- Progress Bars
- Progress Bar Height
- Progress Bar Colors
- Multicolored Progress Bar
- Cards
- Three-Card Layout
- The Layout
- Shortcuts on Rows: Row Columns
- Example: Six-Column Layout for All Devices
- Example: Three Columns for Medium, Six Columns for Large
- Vertical Alignment
- Middle Alignment
- Top and Bottom Alignment
- Different Vertical Alignments Within the Same Row
- Less Than 12 and Horizontal Alignment
- Left Alignment
- Center and Right Alignment
- Space Between
- Space Around
- Nesting
- Twitter Bootstrap Defaults
- Tasks and Quizzes
- Key Takeaways
- Chapter 3: Target Project 1
- Learning Goals
- Introduction
- Start with HTML
- The Class nav
- The HTML of Each Card
- Carousels
- Final Checkpoint
- Closing Note
- Tasks and Quizzes
- Key Takeaways
- Chapter 6: Cover Page Project
- Learning Goals
- Introduction
- Notable Things of This Page
- Empty Twitter Bootstrap Page
- The Background Image
- The Image Brightness
- The Navigation Bar
- Content on the Center of the Page
- Footer
- Closing Note
- Tasks and Quizzes
- Key Takeaways
- Chapter 7: Admin Dashboard
- Learning Goals
- Introduction
- Empty Twitter Bootstrap Page
- Navigation Bar
- Standard Navigation Bar Content
- Aligning to the Right
- The Navigation Items and Navigation Links
- Collapse and Expand
- The Brand link
- Make the Brand Link Stand Out
- Add Some Color to Your Nav Bar
- Adding the Button to Unfold Menu Options on Small Devices
- Making the Button Appear Only on Small Devices
- Creating the Hamburger Icon
- Adding Behavior to the Button
- Final Touches to Our Navigation Bar
- Adding the Main Content
- Making the Paragraph Content Stand Out
- Aligning Nav Bar Content with Page Main Content
- Closing Notes
- Tasks and Quizzes
- Key Takeaways
- Chapter 4: Theme Reference: Part 1
- Learning Goals