Tugas Pemrograman Web 4
<html>
<head>
<link href="bootstrap.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="container">
<div class="row>
<nav class="nav" navbar-default col-md-12">
<div class="container-fluid">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
</nav>
<div class = col-md-12>
<h2>Whales</h2>
</div>
<article>
<p>Whales are a widely distributed and diverse group
of fully aquatic placental marine mammals. They are an informal grouping within the infraorder Cetacea,
usually excluding dolphins and porpoises.Whales, dolphins and porpoises belong to the order Cetartiodactyla
with even-toed ungulates and their closest living relatives are the hippopotamuses, having diverged about 40
million years ago. The two parvorders of whales, baleen whales (Mysticeti) and toothed whales (Odontoceti),
are thought to have split apart around 34 million years ago. The whales comprise eight extant families:
Balaenopteridae (the rorquals), Balaenidae (right whales), Cetotheriidae (the pygmy right whale),
Eschrichtiidae (the gray whale), Monodontidae (belugas and narwhals),
Physeteridae (the sperm whale), Kogiidae (the dwarf and pygmy sperm whale), and Ziphiidae (the beaked whales).</p>
</article>
<div class="col-sm-8 slide-row">
<div id="carousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel" data-slide-to="0" class="active"></li>
<li data-target="#carousel" data-slide-to="1"></li>
<li data-target="#carousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src ="killer whale.jpg"/>
<div class="carousel-caption ">
<h3>Orca</h3>
</div>
</div>
<div class="item">
<img src ="blue-whale-tale.jpg"/>
<div class="carousel-caption ">
<h3>Ekor Paus Biru</h3>
</div>
</div>
<div class="item">
<img src ="humpbackwhale.jpg"/>
<div class="carousel-caption ">
<h3>Paus Biru</h3>
</div>
</div>
<a class="left carousel-control" href="#carousel" data-slide = "prev">
<span class="icon-prev"</span>
</a>
<a class="right carousel-control" href="#carousel" data-slide = "next">
<span class="icon-next"</span>
</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>
Komentar
Posting Komentar