Web Development

Bootstrap

Bootstrap

Language: English

Pages: 128

ISBN: 1449343910

Format: PDF / Kindle (mobi) / ePub


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

Programming the Mobile Web

CSS Essentials

Programming Amazon EC2

jQuery for Designers: Beginner's Guide

Web Design Blueprints

 

 

 

 

 

 

 

 

 

 

 

 

type="text" placeholder=".span1">

... Figure 2-35. Control row Uneditable text If you want to present a form control without allowing the user to edit the input, simply add the class .uneditable-input (see Figure 2-36): Some value here Figure 2-36. Uneditable input Form actions When you place the form actions at the bottom of a .horizontal-form, the inputs will correctly line up with the floated form controls

least 40 pixels of padding to the tag:

Title

Fixed bottom navbar To affix the navbar to the bottom of the page, simply add the .fixed-navbar-bottom class to the navbar. Once again, to prevent overlap, add at least 40 pixels of padding to the

class="well well-large"> Look, I'm in a .well-large!

Look, I'm in a .well-small!

Helper Classes Here are some helper classes that might come in handy. Pull left To float an element to the left, use the .pull-left class:

...

.pull-left { float: left; } Pull right To float an element to the right, use the .pull-right class:

...

.pull-right { float: right; }

CodeKit preprocessor, Using LESS collapsing navbars, Responsive navbar collapsing page divisions, Collapse colors changing for buttons, Buttons changing for links, Global Styles, Using LESS changing for rows, Table Row Classes columns nesting, Nesting Columns offsetting, Offsetting Columns condensed table class, Condensed table containers, layouts for, Container Layouts controls, for forms, Supported Form Controls, Extended Form Controls CSS (Cascading Style

development environment is compared to the one envisioned by the Mac. But at least Bootstrap is out there doing the factoring. If I want to put up a menu, I can just use the code that creates menus. Sure, my menu looks like all the others, but that’s a good thing for users. There is no need to learn a second or third way to use a menu. That this is needed, desperately needed, is indicated by the incredible uptake of Bootstrap. I use it in all the server software I’m working on. And it shows

Download sample

Download