Skip to content

Commit a9df29d

Browse files
Corydon BaylorCorydon Baylor
Corydon Baylor
authored and
Corydon Baylor
committed
added bootstrap
1 parent 08b9890 commit a9df29d

3 files changed

Lines changed: 64 additions & 5 deletions

File tree

‎index.html‎

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,46 @@
22

33
<head>
44
<title>Example</title>
5+
<!-- Latest compiled and minified CSS -->
6+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
7+
<!-- jQuery library -->
8+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
9+
<!-- Popper JS -->
10+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
11+
<!-- Latest compiled JavaScript -->
12+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
13+
14+
<!-- Our CSS -->
515
<link rel="stylesheet" href="styles/style.css">
16+
617
</head>
718

819
<body class="page-style">
9-
<div>
10-
<a href="pages/second.html">Link to your second page</a>
20+
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
21+
<ul class="navbar-nav">
22+
<li class="nav-item">
23+
<a class="nav-link" href="index.html">Home</a>
24+
</li>
25+
<li class="nav-item">
26+
<a class="nav-link" href="pages/second.html">Second Page</a>
27+
</li>
28+
</ul>
29+
</nav>
30+
<div class="container">
31+
<br>
1132
<h2>Create Your Static Website</h2>
1233
<p>Here is the content of your site.</p>
34+
<strong>Using the Grid System</strong>
35+
<div class="row">
36+
<div class="col m-2 examples"></div>
37+
<div class="col m-2 examples"></div>
38+
<div class="col m-2 examples"></div>
39+
</div>
40+
<div class="row">
41+
<div class="col-2 m-2 examples"></div>
42+
<div class="col-5 m-2 examples"></div>
43+
<div class="col-4 m-2 examples"></div>
44+
</div>
1345
</div>
1446
</body>
1547

‎pages/second.html‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,32 @@
22

33
<head>
44
<title>Second Page</title>
5-
<link rel="stylesheet" href="styles/style.css">
5+
<!-- Latest compiled and minified CSS -->
6+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
7+
<!-- jQuery library -->
8+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
9+
<!-- Popper JS -->
10+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
11+
<!-- Latest compiled JavaScript -->
12+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
13+
14+
<!-- Our CSS -->
15+
<link rel="stylesheet" href="../styles/style.css">
616
</head>
717

818
<body class="page-style">
9-
<div>
10-
<a href="../index.html">Link to your homepage</a>
19+
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
20+
<ul class="navbar-nav">
21+
<li class="nav-item">
22+
<a class="nav-link" href="../index.html">Home</a>
23+
</li>
24+
<li class="nav-item">
25+
<a class="nav-link" href="second.html">Second Page</a>
26+
</li>
27+
</ul>
28+
</nav>
29+
<br>
30+
<div class="container">
1131
<h2>Now you have two pages!</h2>
1232
<p>Isn't that nice</p>
1333
</div>

‎styles/style.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,10 @@
33
color:#2F4F4F;
44
}
55

6+
.examples {
7+
background-color: #6699cc;
8+
color: white;
9+
border-radius: 5px;
10+
height: 100px;
11+
min-width: 200px;
12+
}

0 commit comments

Comments
 (0)