Scribd
Upload
83 views3 pages

Layout

This document is an HTML template for a bookstore website. It includes sections for the header, navigation menu, main content area, footer, and necessary CSS and JavaScript links. The header contains the site name and description. The navigation menu links to index, about, and other pages. The main content displays a welcome message and image along with placeholders for additional content. The footer provides contact information.

Uploaded by

Anh Trần
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
83 views3 pages

Layout

This document is an HTML template for a bookstore website. It includes sections for the header, navigation menu, main content area, footer, and necessary CSS and JavaScript links. The header contains the site name and description. The navigation menu links to index, about, and other pages. The main content displays a welcome message and image along with placeholders for additional content. The footer provides contact information.

Uploaded by

Anh Trần
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

<!

DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--

Template 2092 Shelf

http://www.tooplate.com/view/2092-shelf

-->
<title>VIETANH02</title>

<!-- load stylesheets -->


<link rel="stylesheet" href="https://fonts.googleapis.com/css?
family=Open+Sans:300,400"> <!-- Google web font "Open Sans" -->
<link rel="stylesheet" href="~/font-awesome-4.7.0/css/font-awesome.min.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="~/css/bootstrap.min.css">
<!-- Bootstrap style -->
<link rel="stylesheet" href="~/css/tooplate-style.css">
<!-- Templatemo style -->
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media
queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
body {
background-image:
url(https://img4.thuthuatphanmem.vn/uploads/2020/12/25/anh-nen-den-full-
hd_042405747.jpg);
background-size: 100%;
}
.tm-site-header {
background-image: url(https://images.unsplash.com/photo-1622737133809-
d95047b9e673?ixlib=rb-
1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8d2FsbHBhcGVyJTIwNGt8ZW58MHx8MHx8&w=1000&q=80
);
background-size: 100%;
}
</style>
</head>

<body>

<div class="container">
<header class="tm-site-header">
<h1 class="tm-site-name">BÀI TẬP 2</h1>
<p class="tm-site-description">Your Online Bookstore</p>

<nav class="navbar navbar-expand-md tm-main-nav-container">


<button class="navbar-toggler" type="button" data-toggle="collapse"
data-target="#tmMainNav" aria-controls="tmMainNav" aria-expanded="false" aria-
label="Toggle navigation">
<i class="fa fa-bars"></i>
</button>

<div class="collapse navbar-collapse tm-main-nav" id="tmMainNav">


<ul class="nav nav-fill tm-main-nav-ul">
<li class="nav-item"><a class="nav-link active"
href="/Home/Index">INDEX</a></li>
<li class="nav-item"><a class="nav-link"
href="/Home/About">ABOUT</a></li>

</ul>
</div>
</nav>

</header>

<div class="tm-main-content">
<section class="tm-margin-b-l">
<header class="text-center">
<h2 class="tm-main-title">"HỌC TẬP CHỦ ĐỘNG, LÀM VIỆC SÁNG
TẠO"</h2>
<img src="~/img/logo.png" alt="Alternate Text" />
<p>Shelf HTML template is provided by Tooplate. Please tell
your friends about it. Thank you. Images are from Unsplash website. In tincidunt
metus sed justo tincidunt sollicitudin. Curabitur magna tellus, condimentum vitae
consectetur id, elementum sit amet erat.</p>
</header>

<div class="tm-gallery">
@RenderBody()
</div>

<nav class="tm-gallery-nav">
<ul class="nav justify-content-center">
<li class="nav-item"><a class="nav-link active"
href="#">1</a></li>
<li class="nav-item"><a class="nav-link"
href="#">2</a></li>
<li class="nav-item"><a class="nav-link"
href="#">3</a></li>
<li class="nav-item"><a class="nav-link"
href="#">4</a></li>
</ul>
</nav>
</section>

<section class="media tm-highlight tm-highlight-w-icon">

<div class="tm-highlight-icon">
<i class="fa tm-fa-6x fa-meetup"></i>
</div>

<div class="media-body">
<header>
<h2>Need Help?</h2>
</header>
<p class="tm-margin-b">Curabitur magna tellus, condimentum
vitae consectetur id, elementum sit amet erat. Phasellus arcu leo, sagittis
fringilla nisi et, pulvinar vestibulum mi. Maecenas mollis ullamcorper est at
dignissim.</p>
<a href="" class="tm-white-bordered-btn">Live Chat</a>
</div>
</section>
</div>

<footer>
<p style="color:white">Liên hệ với chúng tôi</p>
<p style="color:white">Gmail:
[email protected]</pstyle="color:white">
<p style="color:white">Sdt: 0765-874-xxx</p>
<p style="color:white">Địa chỉ: 140 Lê Trọng Tấn, Tây Thạnh, Tân Phú,
Thành phố Hồ Chí Minh</p>
</footer>
</div>

<!-- load JS files -->


<script src="~/js/jquery-1.11.3.min.js"></script> <!-- jQuery
(https://jquery.com/download/) -->
<script src="~/js/popper.min.js"></script> <!-- Popper
(https://popper.js.org/) -->
<script src="~/js/bootstrap.min.js"></script> <!-- Bootstrap
(https://getbootstrap.com/) -->
<script>

$(document).ready(function () {

// Update the current year in copyright


$('.tm-current-year').text(new Date().getFullYear());

});

</script>

</body>
</html>

You might also like