O'Reilly logo

Twitter Bootstrap Web Development How-To by David Cochran

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating a products page (Must know)

Before we finish creating pages, let's quickly create a basic products page with columns and rows for products, prices, and features.

Getting ready

Let's get our new template file ready for our products page.

  1. Make a copy of about.html, and rename it products.html.
  2. Open products.html in your editor.
  3. Update the title tag to read <title>Products | My Bootstrap Site</title>.
  4. Update the h1 heading to read <h1>Products</h1>.
  5. Save the file and open it in your browser.

How to do it…

We're going to create a basic table template for laying out features of products.

  1. In the page, we'll use a narrow left-hand sidebar for an introduction to our table. Update the column div class="span8" by changing the span8 to span3, and update the ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required