<!DOCTYPE html>
<html>
<head>
<title>Car Vacation - Destination</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="
https://
stackpath.
bootstrapcdn.
com/
bootstrap/4.5.2/
css/
bootstrap.min.
css" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QLeykU8jmeO+TX3qgNkP0GNIgB6Hp" crossorigin="anonymous">
<link rel="stylesheet" type="text/
css" href="style.
css">
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Car Vacation</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-tar
get="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Destination</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</nav>
</header>
<main>
<section class="banner">
<h1>Destination</h1>
</section>
<section class="cards">
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="card">
<img class="card-img-top" src="
https://picsum.photos/seed/picsum/300/200" alt="Card image cap">
<div class="card-body">
<h5 class="card-title">New York</h5>
<p class="card-text">New York City is the most populous city in the United States. It is known for its famous landmarks such as the Statue of Liberty, Empire State Building and Central Park.</p>
<a href="#" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<img class="card-img-top" src="
https://picsum.photos/seed/picsum/300/200" alt="Card image cap">
<div class="card-body">
<h5 class="card-title">Paris</h5>
<p class="card-text">Paris, the capital of France, is known for its artistic heritage, fashion, fine dining and iconic landmarks such as the Eiffel Tower, Notre-Dame Cathedral and the Louvre Museum.</p>
<a href="#" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<img class="card-img-top" src="
https://picsum.photos/seed/picsum/300/200" alt="Card image cap">
<div class="card-body">
<h5 class="card-title">Tokyo</h5>
<p class="card-text">Tokyo, the capital of Japan, is known for its modern skyscrapers, historic temples, shopping and entertainment districts, and unique blend of traditional and contemporary culture.</p>
<a href="#" class="btn btn-primary">Learn More</a>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<div class="row">
<div class="col-md-12">
<p>© 2020 Car Vacation. All rights reserved.</p>
</div>
</div>
</div>
</footer>
<script src="
https://code.jquery.
com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="
https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js"></script>
<script src="
https://
stackpath.
bootstrapcdn.
com/
bootstrap/4.5.2/js/
bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QLeykU8jmeO+TX3qgNkP0GNIgB6Hp" crossorigin="anonymous"></script>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
1172
