IMG-LOGO
Trang Chủ Học Bootstrap Bài 2 - Tạo website bằng bootstrap - Lập trình bootstrap/jquery
×

Lý Thuyết

01. Hướng dẫn cài đặt bootstrap + jquery - học lập trình bằng bootstrap+ Jquery 02. Học bootstrap qua ví dụ 2- Bootstrap 03. Học bootstrap qua ví dụ 3 - Bootstrap 04. Thao tác lên tags html bằng jquery - Bootstrap 05. Xử lý sự kiện trong jquery (events in jquery) - Bootstrap 06. Viết trang web quản lý sinh viên bằng jquey + bootstrap phần 1 07. Viết trang web quản lý sinh viên bằng jquey + bootstrap phần 2 08. Hướng dẫn học bootstrap qua ví dụ dự án web đồng hồ - bootstrap

Bài Tập

Bài 1 - Tạo website bằng bootstrap 4 Thiết kế website -> Su dung Bootstrap 4 Thiết kế web bán rau củ quả - t010.gokisoft.com Bài tập - Thiết kế website sử dụng Bootstrap/jQuery Bài tập - Thiết kế trang web báo dân trí

Examination & Test

TEST - Yêu cầu thiết kế website - landing page html/css/js - bootstrap/jquery

Source Code Chia Sẻ

[Share Code] Tìm hiểu bootstrap Bài 2 - Tạo website bằng bootstrap - Lập trình bootstrap/jquery [Share Code] Tìm hiều bootstrap - Lập trình Bootstrap/jQuery [Share Code] Tìm hiểu Bootstrap - jQuery - Lập trình Bootstrap/jQuery [Share Code] Hướng dẫn tìm hiểu Bootstrap/jQuery [Share Code] Tìm hiểu bootstrap - Lập trình Bootstrap/jQuery - Hoc Bootstrap [Share Code] Tìm hiểu về Bootstrap + jQuery - Viết chương trình quản lý sản phẩm

Tài Liệu Học

Bootstrap 4 - Giới Thiệu Bootstrap 4 Containers Bootstrap 4 Grids Bootstrap 4 Text/Typography Bootstrap 4 Colors Bootstrap 4 Tables Bootstrap 4 Images Bootstrap 4 Jumbotron Bootstrap 4 Alerts Bootstrap 4 Buttons Bootstrap 4 Button Groups Bootstrap 4 Badges Bootstrap 4 Progress Bars Bootstrap 4 Spinners Bootstrap 4 Pagination Bootstrap 4 List Groups Bootstrap 4 Cards Bootstrap 4 Dropdowns Bootstrap 4 Collapse Bootstrap 4 Navs Bootstrap 4 Navigation Bar Bootstrap 4 Forms Bootstrap 4 Form Inputs Bootstrap 4 Inputs Group Bootstrap 4 Custom Forms Bootstrap 4 Carousel Bootstrap 4 Modal Bootstrap 4 Tooltip Bootstrap 4 Popover Bootstrap 4 Toast Bootstrap 4 Scrollspy (Advanced) Bootstrap 4 Utilities Bootstrap 4 Flex Bootstrap 4 Icons Bootstrap 4 Media Objects Bootstrap 4 Filters (Advanced) Bootstrap 4 - Form đăng ký tài khoản người dùng




Bài 2 - Tạo website bằng bootstrap - Lập trình bootstrap/jquery

by TRẦN VĂN ĐIỆP - 14:47 28/10/2020 3,594 Lượt Xem


Theo dõi cập nhật nội dung học trên Youtube & Facebook


Bình luận



Chia sẻ từ lớp học

Nguyễn Anh Vũ [T2008A]

Ngày viết: 13:54 06/11/2020


#dongho.html


<!DOCTYPE html>
<html>
<head>
	<title>Bootstrap Tutorial</title>

	
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
	

	<style type="text/css">
		.nav-link {
			
			color: grey !important;
		}

		.navbar-nav .active {
			background-color: #f1a03c;
			color: white !important;
		}
	</style>
</head>
<body>
	
	<div class="row" style="background-color: black;">
		<div class="col-md-6" style="text-align: center; color: grey;padding-top: 7px; padding-bottom: 7px;">
			Hang that - gia chuan - phuc vu tan tam
		</div>
		<div class="col-md-6" style="text-align: center;padding-top: 7px; padding-bottom: 7px;">
			<i class="fa fa-phone" style="color: #ece507"></i>
			<a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
			<a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
			<a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
			<div class="input-group mb-3" style="width: 180px; float: right; margin-bottom: 0px !important; background-color: grey;">
			  <input type="text" class="form-control" placeholder="Email" id="demo" name="email" style="width: 180px; background-color: #f7f5f5;">
			  <div class="input-group-append">
			    <span class="input-group-text">
			    	<i class="fa fa-search"></i>
			    </span>
			  </div>
			</div>
		</div>
	</div>
	
	<div class="row" style="border-top: solid #f1a03c 5px;">
		<div class="col-md-5" style="padding-top: 10px; padding-bottom: 10px;">
			
			<img src="https://res.cloudinary.com/ziczacgroup/image/upload/v1587623413/qhwncq3wtjkrsyke6ayw.png" style="width: 160px; padding-left: 80px;">
		</div>
		<div class="col-md-7">
			
			<nav class="navbar navbar-expand-sm" style="float: right; padding: 0px !important;">
			 
			  <ul class="navbar-nav">
			    <li class="nav-item">
			      <a class="nav-link" href="#">
			      	<i class="fa fa-home" style="color: #f1a03c"></i>
			      </a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Dong Ho Nam</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Dong Ho Nu</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Dong Ho Doi</a>
			    </li>
			    <li class="nav-item active">
			      <a class="nav-link" href="#">Mau Hot Nhat</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Sale</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Blog</a>
			    </li>
			  </ul>
			</nav>
		</div>
	</div>
	
	<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
	  <div class="carousel-inner">
	    <div class="carousel-item active">
	      <img class="d-block w-100" src="https://png.pngtree.com/thumb_back/fw800/back_our/20190621/ourmid/pngtree-black-dynamic-watch-simple-black-banner-image_182859.jpg" alt="First slide">
	    </div>
	    
	  </div>
	</div>
	
	<div class="row">
		
		<div class="col-md-3" style="background-color: black; color: white;">
			Danh Mục Srn Phẩm
			<ul>
				<li>  Edox</li>
				<li>  Michael Kos</li>
				<li>  Mare by Mare Jacobs</li>
				<li>  Burberry</li>
				<li>  Bulova</li>
				<li>  Bulova Accutron</li>
				<li>  Calvin Klein</li>
				<li>  DKNY</li>
				<li>  Frederique Constant</li>
				<li>  Gucci</li>
				<li>  Hamilton</li>
				<li>  Longines</li>
				<li>  Maurice Lacroix</li>
				<li>  Montblanc</li>
				<li>  Movado</li>
				<li>  Omega</li>
				<li>  Oris</li>
				<li> Rado</li>
				<li>  Raymond Weil</li>
				<li>  Skagen</li>
				<li>  Swarovski</li>
				<li>  TAG Heuer</li>
				<li>  Tissot</li>
				<li>  Victorinox Swiss Army</li>
				<li>  Lacoste</li>	
				<li>  Zenith</li>
				<li>  Charmex</li>
				<li>  Seico</li>		
			</ul>
		</div>
		<div class="col-md-9">
			<div class="row">
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
			</div>
			<div class="row">
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-3">
					<img src="https://images-na.ssl-images-amazon.com/images/I/81ZKNYBwYlL._AC_SY606_.jpg" style="width: 95%">
					<p style="text-align: center;">TEST TEST TEST TEST TEST TEST TEST TEST</p>
				</div>
				<div class="col-md-12">
					<ul class="pagination">
					  <li class="page-item"><a class="page-link" href="#">Previous</a></li>
					  <li class="page-item"><a class="page-link" href="#">1</a></li>
					  <li class="page-item"><a class="page-link" href="#">2</a></li>
					  <li class="page-item"><a class="page-link" href="#">3</a></li>
					  <li class="page-item"><a class="page-link" href="#">Next</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3724.0974938515083!2d105.77963881422536!3d21.02878468599839!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x313454b32ecb92db%3A0x3964e6238a3bd088!2zOCBUw7RuIFRo4bqldCBUaHV54bq_dCwgTeG7uSDEkMOsbmgsIEPhuqd1IEdp4bqleSwgSMOgIE7hu5lpLCBWaWV0bmFt!5e0!3m2!1sen!2s!4v1604043977876!5m2!1sen!2s" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
		</div>
	</div>
	
	<script type="text/javascript">
		
	</script>
</body>
</html>


Triệu Văn Lăng [T2008A]

Ngày viết: 20:31 03/11/2020



<!DOCTYPE html>
<html lang="en">
<head>
	<title>Donghoshop.com</title>
	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
	<!-- Latest compiled and minified CSS -->
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

		<!-- jQuery library -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

		<!-- Popper JS -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

		<!-- Latest compiled JavaScript -->
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
		<style type="text/css">
			a {
				color: black;
			}
		</style>
</head>
<body>
	<div class="row" style="background-color: black">
		<div class="col-md-6" style="text-align: center; color: grey; padding-top: 7px;padding-bottom: 7px">
			Hàng thật-Giá chuẩn-Phục vụ tận tâm
		</div>
		<div class="col-md-6" style="text-align: center; padding-top: 7px;padding-bottom: 7px">
			<i class="fa fa-phone" style="color: yellow"></i>
			<a href="telno:0969696969" style="color: red; margin-left: 10px">0976670256</a>
			<a href="telno:0969696969" style="color: red; margin-left: 10px">0976670256</a>
			<a href="telno:0969696969" style="color: red; margin-left: 10px">0976670256</a>
			<div class="input-group mb-3" style="width: 160px; float: right; margin-bottom: 0px; background-color: grey; margin-right: 30px">
				<input type="text" class="form-control" placeholder="Từ khóa tìm kiếm" name="search" style="width: 160px; background-color: #f7f5f5" >
				 <div class="input-group-append">
				    <span class="input-group-text">
				    	<i class="fa fa-search" style="background-color: yellow"></i>
			    	</span>
			  </div>
			</div>
		</div>
	</div>
	<div class="row" style="border-top: solid #f1a03c 5px;">
		<div class="col-md-5" style="padding-top: 10px; padding-bottom: 10px;">
			<img src="https://thegioidaydongho.com/wp-content/uploads/2020/04/logo-canh-1989w.png" width="100%" height="100px" style="padding: 10px;">
		
	</div>
	<div class="col-md-7" style="padding-top: 30px">
		<nav class="navbar navbar-expand-sm" style="float: right; padding: 0px !important">
			 <ul class="navbar-nav">
			    <li class="nav-item">
			      <a class="nav-link" href="#">
			      	<i class="fa fa-home" style="color: #f1a03c"></i>
			      </a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Đồng Hồ Nam|</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Đồng Hồ Nữ|</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Đồng Hồ Đôi |</a>
			    </li>
			    <li class="nav-item active">
			      <a class="nav-link" href="#">Mẫu Hót Nhat|</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Sale|</a>
			    </li>
			    <li class="nav-item">
			      <a class="nav-link" href="#">Blog</a>
			    </li>
			  </ul>
		</nav>
	</div>
	<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
	  	<div class="carousel-inner">
	    	<div class="carousel-item active" style="padding-left: 50px">
	      		<img class="d-block w-100" src="https://i.ytimg.com/vi/gMzsP8KapOg/maxresdefault.jpg" width="100%" alt="First slide">
			</div>	
			<div class="carousel-item" style="padding-left: 50px">
				<img src="https://royaljewelers.com/wp-content/uploads/2018/02/Value-Watches-Banner.jpg" alt="Second slide">
			</div>
		</div>
	</div>

	<div class="container" style="margin-top: 20px;">
		<div class="float-left card bg-dark">
			<div class="card-header text-white">DANH MỤC SẢN PHẨM</div>
			<div class="card-body text-white" style="text-align: left;">
			<ul>
				
				<li>
					<a href="#">Edox</a></li>
				<li>
					<a href="#">Michael kors</a></li>
				<li>
					<a href="#">Marc By Marc Jacobs</a></li>
				<li>
					<a href="#">Burberry</a></li>
				<li>
					<a href="#">Bulova</a></li>
				<li>
					<a href="#">Bulova Accutron</a></li>
				<li>
					<a href="#">Calvin Kelein</a></li>
				<li>
					<a href="#">DKNY</a></li>
				<li>
					<a href="#">Frederique Constant</a></li>
				<li>
					<a href="#">Gucci</a></li>
				<li>
					<a href="#">Hamilton</a></li>
				<li>
					<a href="#">Longines</a></li>
				<li>
					<a href="#">Maurice Lacroix</a></li>
				<li>
					<a href="#">Montblanc</a></li>
				<li>
					<a href="#">Movado</a></li>
				<li>
					<a href="#">Omega</a></li>
				<li>
					<a href="#">Oris</a></li>
				<li>
					<a href="#">Rado</a></li>
				<li>
					<a href="#">Tissot</a></li>
				<li>
					<a href="#">Rado</a></li>
				<li>
					<a href="#">Raymond Weil</a></li>
				<li>
					<a href="#">Skagen</a></li>
				<li>
					<a href="#">Swaorovski</a></li>
				<li>
					<a href="#">TAG Heuer</a></li>
				<li>
					<a href="#">Victorynox Swiss Amy</a></li>
				<li>
					<a href="#">Lacoste</a></li>
				<li>
					<a href="#">Zenith</a></li>
				<li>
					<a href="#">Charmex</a></li>
				<li>
					<a href="#">Seiko</a></li>
			</ul>
		</div>
		</div>
		<div class="card-body bg-light">
			<div class="container-fluid">
				<div class="row">
					<div class="col">
						<a href="#" class="nav-link">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcSOfcL8xi33WClZf5BrFWw6lXpz-uFgIAwFswT6O8Y9JSFOO93BjpUr8HzbqcN_RJ5huVSo2q85&usqp=CAc">
						</a>
						<p>Đồng hồ Gucci YA126487A</p>
						<button style="width: 200px;  background-color: black;">
							<a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a>
						</button>
					</div>
					<div class="col">
						<a href="#" class="nav-link">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQt4mOLgAK7J73kaMFjTktte6ixHYF0JIjJUpUFPBmkAf2Y7KaFwmCrpLIw_1vepjX0XgMI-NOQ&usqp=CAc">
						</a>
						<p>Đồng hồ Gucci YA126487A</p>
						<button style="width: 200px;  background-color: black;">
							<a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a>
						</button>
					</div>
					<div class="col">
						<a href="#" class="nav-link">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcRYWYCz6JR-Sw-9DSZCYVDLxb-EWbHDE5pViyFQtXBm3xTDa11VwF_gKUARVtimBAR_YqvI2tf3&usqp=CAc">
						</a>
						<p>Đồng hồ Gucci YA126487A</p>
						<button style="width: 200px;  background-color: black;">
							<a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a>
						</button>
					</div>
					<div class="col">
						<a href="#" class="nav-link">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQHPXG98tdePF-C2BpXyFK6NOCXGM5W9IRBsw&usqp=CAU" style="margin-left: -15px" width="50%">
						</a>
						<p>Đồng hồ Gucci YA126487A</p>
						<button style="width: 200px;  background-color: black;">
							<a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a>
						</button>
					</div>
					<div class="col">
						<a href="#" class="nav-link">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQt4mOLgAK7J73kaMFjTktte6ixHYF0JIjJUpUFPBmkAf2Y7KaFwmCrpLIw_1vepjX0XgMI-NOQ&usqp=CAc">
						</a>
						<p>Đồng hồ Gucci YA126487A</p>
						<button style="width: 200px;  background-color: black;">
							<a href="#" class="nav-link" style="color: white; padding-left: -20px"  >Giá: Liên hệ <i class="fas fa-phone-volume"></i></a>
						</button>
					</div>
					
					</div>
				</div>
			</div>
		</div>
</body>
</html>


Nguyễn đình quân [T2008A]

Ngày viết: 17:12 02/11/2020



<!DOCTYPE html>
<html>
<head>
  <title>DONGHOSO1.VN</title>

  <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

  <!-- jQuery library -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

  <!-- Popper JS -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

  <!-- Latest compiled JavaScript -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
  <!-- https://fontawesome.com/icons?from=io -->

  <style type="text/css">
    .nav-link {
      
      color: grey !important;
    }

    .navbar-nav .active {
      background-color: #f1a03c;
      color: white !important;
    }
  </style>
</head>
<body>

  <div class="row" style="background-color: black;">
    <div class="col-md-6" style="text-align: center; color: grey;padding-top: 7px; padding-bottom: 7px;">
      Hang that - gia chuan - phuc vu tan tam
    </div>
    <div class="col-md-6" style="text-align: center;padding-top: 7px; padding-bottom: 7px;">
      <i class="fa fa-phone" style="color: #ece507"></i>
      <a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
      <a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
      <a href="telno:0967025996" style="color: red; margin-left: 10px;">0967.025.996</a>
      <div class="input-group mb-3" style="width: 180px; float: right; margin-bottom: 0px !important; background-color: grey;">
        <input type="text" class="form-control" placeholder="Email" id="demo" name="email" style="width: 180px; background-color: #f7f5f5;">
        <div class="input-group-append">
          <span class="input-group-text">
            <i class="fa fa-search"></i>
          </span>
        </div>
      </div>
    </div>
  </div>

  <div class="row" style="border-top: solid #f1a03c 5px;">
    <div class="col-md-5" style="padding-top: 10px; padding-bottom: 10px;">
      <img src="https://res.cloudinary.com/ziczacgroup/image/upload/v1587623413/qhwncq3wtjkrsyke6ayw.png" style="width: 160px; padding-left: 80px;">
    </div>
    <div class="col-md-7">
    
      <nav class="navbar navbar-expand-sm" style="float: right; padding: 0px !important;">
     
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link" href="#">
              <i class="fa fa-home" style="color: #f1a03c"></i>
            </a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Dong Ho Nam</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Dong Ho Nu</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Dong Ho Doi</a>
          </li>
          <li class="nav-item active">
            <a class="nav-link" href="#">Mau Hot Nhat</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Sale</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Blog</a>
          </li>
        </ul>
      </nav>
    </div>
  </div>
  
  <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
      <div class="carousel-item active">
        <img class="d-block w-100" src="https://png.pngtree.com/thumb_back/fw800/back_our/20190621/ourmid/pngtree-black-dynamic-watch-simple-black-banner-image_182859.jpg" alt="First slide">
      </div>
      
    </div>
  </div>
  
  <div class="row">
    <!-- left me -->
    <div class="col-md-3" style="background-color: black; color: white;">
      <ul>
        DANH MỤC SẢN PHẨM 
        <li>Edox</li>
        <li>Michael Kos</li>
        <li>Marc by Marc Jacobs </li>
        <li>Burberry</li>
        <li>Bulova</li>
        <li>Bulova Accutron</li>
        <li>Calvin Klein</li>
        <li>DKNY</li>
        <li>Fredenque Constant</li>
        <li>Gucci</li>
        <li>Hamilton</li>
        <li>Longines</li>
        <li>Maurice Lacroix</li>
        <li>Montblanc</li>
        <li>Movado</li>
        <li>Omega</li>
        <li>Oris</li>
        <li>Rado</li>
        <li>Raymond Weil</li>
        <li>Skagen</li>
        <li>Swarovski</li>
        <li>TAG Heuer</li>
        <li>Tissot</li>
        <li>Victonnox Swiss Amy</li>
        <li>Lacoste</li>
        <li>Zenith</li>
        <li>Chamex</li>
        <li>Seiko</li>

      </ul>
       <img src="https://dongho24h.com/upload/1/products/l_576377103_le_chateau_01.jpg" style="width: 100%;">
    </div>
    <div class="col-md-9">
      <div class="row">
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/dong-ho-casio-b640wc-5adf-pin-nam-inox-1-1.jpg" style="width: 95%">
          <p style="text-align: center;">Casio B640WC-5ADF Nữ Quartz</p>
          1.391.000VNĐ(Giá bạn tiết kiệm: 348.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/casio-mtp-1374d-1avdf.jpg" style="width: 95%">
          <p style="text-align: center;">Casio MTP-1374D-1AVDF Nam Quartz</p>
          1.579.000VNĐ(Giá bạn tiết kiệm: 395.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/casio-ga-120-1adr.jpg" style="width: 95%">
          <p style="text-align: center;">Casio G-SHOCK GA-120-1ADR Nam Quartz</p>
          2.839.000VNĐ(Giá bạn tiết kiệm: 710.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/casio-efr-527d-7avudf.jpg" style="width: 95%">
          <p style="text-align: center;">Casio Edifice EFR-527D-7AVUDF Nam Quartz</p>
          2.689.000VNĐ(Giá bạn tiết kiệm: 672.000VNĐ)
        </div>
      </div>
      <div class="row">
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/casio-a168wegb-1bdf.jpg" style="width: 95%">
          <p style="text-align: center;">Casio A168WEGB-1BDF Nữ Quartz</p>
          1.749.000VNĐ(Giá bạn tiết kiệm: 437.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2020/01/casio-g-shock-GA-2000-5ADR.jpg" style="width: 95%">
          <p style="text-align: center;">Casio G-SHOCK GA-2000-5ADR Nam Quartz</p>
          3.366.000VNĐ(Giá bạn tiết kiệm: 841.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2020/01/casio-g-shock-GA-710GB-1ADR.jpg" style="width: 95%">
          <p style="text-align: center;">Casio G-SHOCK GA-710GB-1ADR Nam Quartz</p>
          3.817.000VNĐ(Giá bạn tiết kiệm: 954.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2020/01/casio-g-shock-GA-700SK-1ADR.jpg" style="width: 95%">
          <p style="text-align: center;">Casio G-SHOCK GA-700SK-1ADR Nam Quartz</p>
          2.895.000VNĐ(Giá bạn tiết kiệm: 724.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/casio-g-shock-G-2900F-1VDR.jpg" style="width: 95%">
          <p style="text-align: center;">Casio G-SHOCK G-2900F-1VDR Nam Quartz</p>
          1.523.000VNĐ(Giá bạn tiết kiệm: 381.000VNĐ) 
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2019/02/dong-ho-casio-MTP-E149L-1BVDF.jpg" style="width: 95%">
          <p style="text-align: center;">Casio MTP-E149L-1BVDF Nam Quartz</p>
          1.504.000VNĐ(Giá bạn tiết kiệm: 376.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2019/09/dong-ho-casio-mtp-1374l-1avdf-nam-pin-day-da-a.jpg" style="width: 95%">
          <p style="text-align: center;">Casio MTP-1374L-1AVDF Nam Quartz</p>
          1.523.000VNĐ(Giá bạn tiết kiệm: 381.000VNĐ)
        </div>
        <div class="col-md-3">
          <img src="https://shopdongho.com/wp-content/uploads/2018/09/dong-ho-casio-she-4510sg-7audr-nu-pin-day-inox.jpg" style="width: 95%">
          <p style="text-align: center;">Casio Sheen SHE-4510SG-7AUDR Nữ Quartz</p>
           6.186.000VNĐ(Giá bạn tiết kiệm: 1.546.000VNĐ)
        </div>
        <div class="col-md-12">
          <ul class="pagination">
            <li class="page-item"><a class="page-link" href="#">Previous</a></li>
            <li class="page-item"><a class="page-link" href="#">1</a></li>
            <li class="page-item"><a class="page-link" href="#">2</a></li>
            <li class="page-item"><a class="page-link" href="#">3</a></li>
            <li class="page-item"><a class="page-link" href="#">Next</a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</body>
</html>


Nguyên Phấn Đông [T2008A]

Ngày viết: 13:01 02/11/2020


#test.html


<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<script src='https://kit.fontawesome.com/a076d05399.js'></script>
	<style type="text/css">
     .navbar-nav .nav-item a:hover{
     	background: yellow;
     	border: 9px !important;
     }
     .float-left{
     	background-color: black !important;
     }
    .khung{
    	border: 1px solid #d9d9d4 !important;
		background-color: #dbd5d5 !important;
		

    }
    .card1{
background-color: #dbd5d5 !important;
    }
	</style>
</head>
<body>
	<nav class="navbar navbar-expand-sm bg-dark" style="color: white;">
		<ul class="navbar-nav">
			<li class="nav-item" style="margin-left: 50px; margin-top: 4px;">Hàng thật - giá chuẩn - Phục vụ tận tâm</li>
			<li class="nav-item" style="margin-left: 200px; margin-top: 4px;">
				<i class="fas fa-phone-alt" style="color: yellow"></i>
				Hotline: 0974 576 809 . 0911 545 121 . 0987 425 657
			</li>
			<li class="nav-item" style="margin-left: 100px;">
				<form class="form-inline" action="/action_page.php">
    				<input class="form-control mr-sm-2" type="text" placeholder="Search">
    				<button class="btn btn-success" type="submit" style="color: yellow;"><i class="fas fa-search" ></i></button>
  				</form>
			</li>
		</ul>
	</nav>
	<nav class="navbar navbar-expand-sm">
		<a class="navbar-brand" href="#" style="margin-left: 104px; padding-right: 20px;">
			<img src="https://donghosomot.com/Styles/images/logo-header.png" alt="logo">
		</a>
		<ul class="navbar-nav" style="margin-left: 248px;"><i class="fas fa-home" style="color: yellow;padding-bottom: 2px;padding-top: 10px;padding-right: 6px;"></i>
			<li class="nav-item">

				<a href="#" class="nav-link" style="color: black;">ĐỒNG HỒ NAM</a>
			</li>
			<li class="nav-item">
				<a href="#" class="nav-link" style="color: black;">ĐỒNG HỒ NỮ</a>
			</li>
			<li class="nav-item">
				<a href="#" class="nav-link" style="color: black;">ĐỒNG HỒ ĐÔI</a>
			</li>
			<li class="nav-item">
				<a href="#" class="nav-link" style="color: black;">MẪU HOT NHẤT</a>
			</li>
			<li class="nav-item">
				<a href="#" class="nav-link" style="color: black;">SALE</a>
			</li>
			<li class="nav-item">
				<a href="#" class="nav-link" style="color: black;">BLOG</a>
			</li>
		</ul>
	</nav>
	<img src="https://donghosomot.com/FileUpload/Images/banner_hourglass_xpx.png" class="mx-auto d-block">
	<div class="container" style="margin-top: 20px;">
		<div class="float-left card bg-dark">
			<div class="card-header text-white">
				DANH MỤC SẢN PHẨM
			</div>
			<div class="card-body text-white">
				<ul>
					<li>
						<a href="#" class="nav-link" style="color: white;">Edox</a>
					</li>
					<li>
						<a href="#" class="nav-link" style="color: white;">Michael Kors</a>
					</li>
					<li>
						<a href="#" class="nav-link" style="color: white;">Mare by Mare Jacobs</a>
					</li>
					<li>
						<a href="#" class="nav-link" style="color: white;">Burberry</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Bulova</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Bulova Accutron</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Calvin Klein</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">DKNY</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Frederique Constant</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Gucci</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Hamilton</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Longines</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Maurice Lacroix</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Montblanc</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Movado</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Omega</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Oris</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Rado</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Raymond Weil</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Skagen</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Swarovski</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">TAG Heuer</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Tissot</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Victorinox Swiss Army</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Lacoste</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Zenith</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Charmex</a>
					</li>
					<li>
						<a href="" class="nav-link" style="color: white;">Seico</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="card-body bg-light khung">
			<div class="container-fluid">
				<div class="row">
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_10.jpg">
						</a>
						<p>Đồng hồ nam Calvin Klein Infinite K5S346G6</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/dongholomayseikossakchonamcdd_result.png">
						</a>
						<p>Đồng hồ nam Frederique Constant Slimline FC-235M4S4</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_3.png">
						</a>
						<p>Đồng hồ nam Orient Sun And Moon RA-AK0304B10B</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					
				</div>
			</div>
			<div class="container-fluid" style="margin-top: 30px;">
				<div class="row">
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/dong_ho_orient_raakbb_result.jpg">
						</a>
						<p>Đồng hồ nam Orient Sun And Moon RA-AK0303L10B</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/raaklb_result.jpg">
						</a>
						<p>Đồng hồ nữ Orient RA-KA0006S00B</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					<div class="col card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/efeeeadecaaad_result.jpg">
						</a>
						<p>Đồng hồ nữ  Versace Mini Vanity VEAA00218</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					
				</div>
			</div>
			<div class="container-fluid padding" style="margin-top: 30px;">
				<div class="row padding">
					<div class="col-md-4 card1 card">
						
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_61.jpg">
						</a>
						<p class="card-text">Đồng hồ nữ Versace V-Circle VE8100118</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					
				</div>
					<div class="col-md-4 card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_60.jpg">
						</a>
						<p>Đồng hồ nam Girard Perregaux Vintage 1945 25850-0-52-1051</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					<div class="col-md-4 card1 card">
						<a href="#" class="nav-link">
							<img src="https://donghosomot.com/FileUpload/Images/thumb/sl__result_232.jpg">
						</a>
						<p>Đồng hồ nữ Versace Greca Icon VELU00619</p>
						<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
					</div>
					
				</div>
			</div>
		</div>
	</div>
	<div class="container-fluid padding">
		<div class="row text-center padding">
			<div class="col-12">
				<img src="https://donghosomot.com/Styles/images/logo-header.png" alt="logo">
				<a href="#"><i class="fas fa-facebook"></i> </a>
				<a href="#"><i class="fas fa-twitter"></i> </a>
			</div>
		</div>
	</div>
</body>
</html>


Nguyễn Xuân Mai [T2008A]

Ngày viết: 22:15 01/11/2020



<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<script src='https://kit.fontawesome.com/a076d05399.js'></script>
</head>
<body>
	<div class="row" style="font-size: small;">
		<div class="nav nav-tabs" style="background-color: black; color: white">
			<ul class="nav">
			 	<li class="nav-item">
			    	<a class="nav-link disabled" href="#">Hàng thật - Giá chuẩn - Phục vụ tận tâm</a>
			  	</li>
			  	<li class="nav-item" style="margin-left: 225px; display: flex;">
					<a href="#" class="nav-link disabled"><i class="fas fa-phone" style="color: orange"></i>Hotline: 093 563 5754 - 093 563 5754 - 093 563 5754</a>
				</li>
				<li>
					<form class="form-inline">
		    			<input class="form-control mr-sm-2" type="text" placeholder="Từ khóa tìm kiếm">
                		<button class="btn btn-outline-warning my-2 my-sm-0" type="submit"><i class="fa fa-search"></i></button>			  	
                	</form>
				</li>
			</ul>
		</div>
	</div>
	<div class="container">
		<ul class="nav">
			<li style="margin-top: 1%">DONGHOSOMOT.COM</li>
		 	<li class="nav-item" style="margin-left: 13%">
		    	<a class="nav-link disabled" href="#"><i class="fas fa-home"></i>ĐỒNG HỒ NAM | ĐỒNG HỒ NỮ | ĐỒNG HỒ ĐÔI | MẪU HOT NHẤT | SALE | BLOG</a>
		  	</li>
		</ul>
	</div>

	<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
	  <div class="carousel-inner">
	    <div class="carousel-item active">
	      <img class="d-block w-100" src="https://res.cloudinary.com/wegoup/image/upload/v1604027906/pxcah94ve1bzhp7a8ous.jpg" alt="First slide">
	    </div>
	    <div class="carousel-item">
	      <img class="d-block w-100" src="https://res.cloudinary.com/wegoup/image/upload/v1604027902/zqsydf2cioamp3yytgtd.jpg" alt="Second slide">
	    </div>
	    <div class="carousel-item">
	      <img class="d-block w-100" src="https://res.cloudinary.com/wegoup/image/upload/v1604027901/rlic67yh7qkbhlyfpbp5.jpg" alt="Third slide">
	    </div>
	  </div>
	</div>
	
	<div class="row">
		<div class="col-md-3">
			<ul class="nav nav-pills flex-column" style="background-color: black">
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Danh mục sản phẩm </a>
		        </li>
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Edox</a>
		        </li>
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Michael Kor</a>
		        </li>
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Marc by Marc Jacob</a>
		        </li>
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Burberry</a>
		        </li>
		        <li class="nav-item">
		          	<a class="nav-link" href="#">Calvin Klein</a>
		        </li>       
		        <li class="nav-item">
		         	<a class="nav-link" href="#">Gucci</a>
		        </li>
		        <li class="nav-item">
		         	<a class="nav-link" href="#">Hamilton</a>
		        </li>
		        <li class="nav-item">
		         	<a class="nav-link" href="#">Omega</a>
		        </li>                                    
		    </ul>
	  	</div>
  		<div class="col-md-9" style="margin-top: 3%">
  			<div class="row">
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-3">
  					<img src="https://res.cloudinary.com/wegoup/image/upload/v1604027903/hecivsgz6gylq2u246rf.jpg" style="width: 95%">
  					<p><center>Đồng Hồ Nam Thụy Sỹ</center></p>
  					<button style="width: 200px; background-color: black;">
  						<a href="#" class="nav-link" style="color: white">
  							Giá: Liên hệ
  							<i class="fas fa-phone-volume" style="margin-left: 30%"></i>
  						</a>
  					</button>
  				</div>
  				<div class="col-md-12" style="margin-top: 3%">
					<ul class="pagination">
					  <li class="page-item"><a class="page-link" href="#">Previous</a></li>
					  <li class="page-item"><a class="page-link" href="#">1</a></li>
					  <li class="page-item"><a class="page-link" href="#">2</a></li>
					  <li class="page-item"><a class="page-link" href="#">3</a></li>
					  <li class="page-item"><a class="page-link" href="#">Next</a></li>
					</ul>
				</div>
  			</div>
  		</div>	
	</div>
	<div class="row" style="margin-top: 5%; background-color: #d9dbde">
		<table style="width: 1000px; margin-left:3%">
			<tr>
				<th>DONGHOSOMOT.COM</th>
				<th>ĐỒNG HỒ SỐ MỘT</th>
				<th>HỖ TRỢ KHÁCH HÀNG</th>
				<th>THANH TOÁN</th>
			</tr>
			<tr><th>
				<div class="col-md-12">
						<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3724.0974938515083!2d105.77963881422536!3d21.02878468599839!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x313454b32ecb92db%3A0x3964e6238a3bd088!2zOCBUw7RuIFRo4bqldCBUaHV54bq_dCwgTeG7uSDEkMOsbmgsIEPhuqd1IEdp4bqleSwgSMOgIE7hu5lpLCBWaWV0bmFt!5e0!3m2!1sen!2s!4v1604043977876!5m2!1sen!2s" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" tabindex="0"></iframe>
					</div>
			</th></tr>
		</table>
	</div>
</body>
</html>


Phân Loại Bài Viết

Danh Sách Bài Học

Đã sao chép!!!