Skip to content

Commit

Permalink
fix index
Browse files Browse the repository at this point in the history
  • Loading branch information
@taidohomework
taidohomework committed Jul 6, 2024
1 parent 506d585 commit 5a978e4
Showing 1 changed file with 60 additions and 129 deletions.
189 changes: 60 additions & 129 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<ol class="carousel-indicators"></ol>
<!DOCTYPE html>
<html lang="vi">

<head>
Expand All @@ -9,142 +9,68 @@
<!-- Add Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
body {
font-family: 'Arial', sans-serif;
background-color: #f8f9fa;
}

header {
background-color: #007bff;
color: white;
padding: 20px 0;
}

header h1 {
text-align: center;
margin: 0;
}

nav ul {
list-style: none;
padding: 0;
text-align: center;
}

nav ul li {
display: inline;
margin: 0 15px;
}

nav ul li a {
color: white;
text-decoration: none;
font-weight: bold;
}

nav ul li a:hover {
text-decoration: underline;
}

.carousel-item img {
width: 100%;
height: 500px;
object-fit: cover;
}

main {
padding: 20px;
}

footer {
background-color: #007bff;
color: white;
text-align: center;
padding: 10px 0;
position: fixed;
width: 100%;
bottom: 0;
}
</style>
</head>

<body>
<header>
<h1>Chào mừng đến v<!DOCTYPE html>
<html lang="vi">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Trang Chủ</title>
<link rel="stylesheet" href="styles.css">
<!-- Add Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
body {
font-family: 'Arial', sans-serif;
background-color: #f8f9fa;
}

header {
background-color: #007bff;
color: white;
padding: 20px 0;
}

header h1 {
text-align: center;
margin: 0;
}

nav ul {
list-style: none;
padding: 0;
text-align: center;
}

nav ul li {
display: inline;
margin: 0 15px;
}

nav ul li a {
color: white;
text-decoration: none;
font-weight: bold;
}

nav ul li a:hover {
text-decoration: underline;
}

.carousel-item img {
width: 100%;
height: 500px;
object-fit: cover;
}

main {
padding: 20px;
}

footer {
background-color: #007bff;
color: white;
text-align: center;
padding: 10px 0;
position: fixed;
width: 100%;
bottom: 0;
}
</style>
</head>

<body>
<header>
<h1>Chào mừng đến với trang web Vui Là 9</h1>
<nav>
<ul>
<li><a href="index.html">Trang Chủ</a></li>
<li><a href="login.html">Đăng Nhập</a></li>
<li><a href="calculator.html">Tính Calories</a></li>
<li><a href="about.html">Giới Thiệu</a></li>
</ul>
</nav>
</header>
<main>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="banner_image.png" class="d-block mx-auto" alt="Image 1">
</div>
<div class="carousel-item">
<img src="banner_image.png" class="d-block mx-auto" alt="Image 2">
</div>
<div class="carousel-item">
<img src="banner_image.png" class="d-block mx-auto" alt="Image 3">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</main>
<footer>
<p>&copy; 2024 Vui Là 9</p>
</footer>

<!-- Add Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script>
$(document).ready(function () {
$('.carousel').carousel({
interval: 2000 // Change the interval value to adjust the speed (in milliseconds)
});
});
</script>
</body>

</html>ới trang web Vui Là 9</h1>
<h1>Chào mừng đến với trang web Vui Là 9</h1>
<nav>
<ul>
<li><a href="index.html">Trang Chủ</a></li>
Expand All @@ -156,6 +82,11 @@ <h1>Chào mừng đến với trang web Vui Là 9</h1>
</header>
<main>
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="banner_image.png" class="d-block mx-auto" alt="Image 1">
Expand Down

0 comments on commit 5a978e4

Please sign in to comment.