-
Notifications
You must be signed in to change notification settings - Fork 0
/
bootstrap-examples.html
80 lines (62 loc) · 2.67 KB
/
bootstrap-examples.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Bootstrap Sample Page</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<style>
nav {
border-top: thin #5b7d87 solid;
border-bottom: thin #5b7d87 solid;
padding-top: 12px;
padding-bottom: 12px;
margin-bottom: 6px;
}
nav .btn {
background-color: darkblue;
color: lightblue;
}
nav .btn:hover{
font-weight: bold;
}
</style>
</head>
<body>
<header class="jumbotron">
<h1>Lion King</h1>
<h2 class="font-italic">King of animals</h2>
<h3 class="text-right mt-5">Scaring all other animals!</h3>
</header>
<nav>
<a href="" class="btn badge-pill">Contact Me</a>
<a href="" class="btn badge-pill">Projects</a>
</nav>
<div class="container">
<div class="row">
<div class="col-lg-3 col-md">
<img src="images/african-lion.jpg" alt="Photo of African Lion" class="img-fluid">
</div>
<div class="col-lg-9 col-md">
<p>Lions are the only cats that live in groups, which are called prides. Prides are family units that may
include up to three males, a dozen or so females, and their young. All of a pride's lionesses are
related, and female cubs typically stay with the group as they age. Young males eventually leave and
establish their own prides by taking over a group headed by another male.
</p>
<p>Only male lions boast manes, the impressive fringe of long hair that encircles their heads. Males defend
the pride's territory, which may include some 100 square miles of grasslands, scrub, or open woodlands.
These intimidating animals mark the area with urine, roar menacingly to warn intruders, and chase off
animals that encroach on their turf.
</p>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
</body>
</html>