Mark-up our Layout

We'll start by adding some basic layout code to the app/index.html file located in the root of our application folder.

Replace the current HTML code within the <body> tags with the following code. Leave the following <script> tags at the bottom intact as they are:

  <div class="container">
    <div class="col-md-12 text-center">
      <a href="#" class="brand ">Angular Box Office</a>
    </div>
    <hr>
    <div ng-view></div>
  </div>

We are wrapping ng-view with the default Bootstrap wrapper container and adding in the code for our brand name. The container class would get our page contents to the center of the screen. The col-md-12 class will create a <div> element that is 12-column wide; it is the equivalent of .span12 in bootstrap2. The text-center ...

Get AngularJS Web Application Development Blueprints now with the O’Reilly learning platform.

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

Start your free trial