Difference between revisions of "Team:Delaware/members/example"

(Created page with "<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-...")
 
 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
<!DOCTYPE html>
 
 
<html lang="en">
 
<html lang="en">
 
   <head>
 
   <head>
Line 10: Line 9:
 
     <link rel="icon" href="../../favicon.ico">
 
     <link rel="icon" href="../../favicon.ico">
  
     <title>Navbar Template for Bootstrap</title>
+
     <title>Starter Template for Bootstrap</title>
  
 
     <!-- Bootstrap core CSS -->
 
     <!-- Bootstrap core CSS -->
Line 19: Line 18:
  
 
     <!-- Custom styles for this template -->
 
     <!-- Custom styles for this template -->
     <link href="navbar.css" rel="stylesheet">
+
     <link href="starter-template.css" rel="stylesheet">
  
 
     <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
 
     <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
Line 34: Line 33:
 
   <body>
 
   <body>
  
     <div class="container">
+
     <nav class="navbar navbar-inverse navbar-fixed-top">
 +
      <div class="container">
 +
        <div class="navbar-header">
 +
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
 +
            <span class="sr-only">Toggle navigation</span>
 +
            <span class="icon-bar"></span>
 +
            <span class="icon-bar"></span>
 +
            <span class="icon-bar"></span>
 +
          </button>
 +
          <a class="navbar-brand" href="#">Project name</a>
 +
        </div>
 +
        <div id="navbar" class="collapse navbar-collapse">
 +
          <ul class="nav navbar-nav">
 +
            <li class="active"><a href="#">Home</a></li>
 +
            <li><a href="#about">About</a></li>
 +
            <li><a href="#contact">Contact</a></li>
 +
          </ul>
 +
        </div><!--/.nav-collapse -->
 +
      </div>
 +
    </nav>
  
      <!-- Static navbar -->
+
    <div class="container">
      <nav class="navbar navbar-default">
+
        <div class="container-fluid">
+
          <div class="navbar-header">
+
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
+
              <span class="sr-only">Toggle navigation</span>
+
              <span class="icon-bar"></span>
+
              <span class="icon-bar"></span>
+
              <span class="icon-bar"></span>
+
            </button>
+
            <a class="navbar-brand" href="#">Project name</a>
+
          </div>
+
          <div id="navbar" class="navbar-collapse collapse">
+
            <ul class="nav navbar-nav">
+
              <li class="active"><a href="#">Home</a></li>
+
              <li><a href="#">About</a></li>
+
              <li><a href="#">Contact</a></li>
+
              <li class="dropdown">
+
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
+
                <ul class="dropdown-menu">
+
                  <li><a href="#">Action</a></li>
+
                  <li><a href="#">Another action</a></li>
+
                  <li><a href="#">Something else here</a></li>
+
                  <li role="separator" class="divider"></li>
+
                  <li class="dropdown-header">Nav header</li>
+
                  <li><a href="#">Separated link</a></li>
+
                  <li><a href="#">One more separated link</a></li>
+
                </ul>
+
              </li>
+
            </ul>
+
            <ul class="nav navbar-nav navbar-right">
+
              <li class="active"><a href="./">Default <span class="sr-only">(current)</span></a></li>
+
              <li><a href="../navbar-static-top/">Static top</a></li>
+
              <li><a href="../navbar-fixed-top/">Fixed top</a></li>
+
            </ul>
+
          </div><!--/.nav-collapse -->
+
        </div><!--/.container-fluid -->
+
      </nav>
+
  
      <!-- Main component for a primary marketing message or call to action -->
+
       <div class="starter-template">
       <div class="jumbotron">
+
         <h1>Bootstrap starter template</h1>
         <h1>Navbar example</h1>
+
         <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p>
         <p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
+
        <p>
+
          <a class="btn btn-lg btn-primary" href="../../components/#navbar" role="button">View navbar docs &raquo;</a>
+
        </p>
+
 
       </div>
 
       </div>
  
     </div> <!-- /container -->
+
     </div><!-- /.container -->
  
  

Latest revision as of 00:28, 31 July 2017

Starter Template for Bootstrap

Bootstrap starter template

Use this document as a way to quickly start any new project.
All you get is this text and a mostly barebones HTML document.