IMG-LOGO
Trang Chủ Học Bootstrap Bài tập - Thiết kế trang web báo dân trí
×

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 tập - Thiết kế trang web báo dân trí

by TRẦN VĂN ĐIỆP - 09:41 01/03/2021 1,473 Lượt Xem


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


Bình luận



Phản Hồi Bởi:

(1) TRẦN VĂN ĐIỆP [Teacher]

Chia sẻ từ lớp học

TRẦN VĂN ĐIỆP [Teacher]

Ngày viết: 09:30 03/03/2021


#vidu.html


<!DOCTYPE html>
<html>
<head>
	<title>Bao Dan Tri</title>
	<meta charset="utf-8">
	<link href="https://dantri.com.vn/favicon.ico" type="image/x-icon" rel="shortcut icon" />
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.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.5.2/js/bootstrap.min.js"></script>
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
</head>
<body>
	<!-- Header start -->
	<!-- Logo -->
	<div class="container">
		<div class="row" style="margin-top: 5px; margin-bottom: 5px;">
			<div class="col-md-2">
				<img src="https://cdnweb.dantri.com.vn/bundle/static/assets/logotetam-04.svg?v=0302114453" style="width: 100%">
			</div>
			<div class="col-md-7">
				<nav class="navbar navbar-expand-sm bg-info navbar-light text-light" style="padding: 0px; background-color: transparent !important; margin-top: 10px;">
				  	<ul class="navbar-nav" style="background-color: #1a7900 !important; border: solid #1a7900 1px; border-radius: 15px;">
					    <li class="nav-item active">
					      <a class="nav-link text-light" href="#" style="font-size: 13px; white-space: nowrap;">Thong Ke COVID-19 The Gioi</a>
					    </li>
					    <li class="nav-item">
					      <a class="nav-link" href="#" style="font-size: 13px; white-space: nowrap; background-color: #d7fae0;">So Ca Nhiem: 115.033.234</a>
					    </li>
					    <li class="nav-item">
					      <a class="nav-link" href="#" style="font-size: 13px; white-space: nowrap; background-color: #d7fae0;">Tu Vong: 2.599.323</a>
					    </li>
					    <li class="nav-item">
					      <a class="nav-link" href="#" style="font-size: 13px; white-space: nowrap; background-color: #d7fae0; border-top-right-radius: 15px;border-bottom-right-radius: 15px;">Binh Phuc: 91.093.232</a>
					    </li>
					  </ul>
				</nav>
			</div>
			<div class="col-md-3">
				<div class="input-group mb-3" style="margin-top: 7px;">
				    <input type="text" class="form-control" placeholder="Tìm kiếm tin tức ...">
				    <div class="input-group-append">
				      <span class="input-group-text"><i class="bi bi-search"></i></span>
				    </div>
				</div>
			</div>
		</div>
	</div>
	<!-- Menu -->
	<!-- Grey with black text -->
	<nav class="navbar navbar-expand-sm bg-info navbar-light text-light" style="background-color: #1a7900 !important; padding-top: 0px; padding-bottom: 0px;">
	  <div class="container">
	  	<ul class="navbar-nav">
		    <li class="nav-item active">
		      <a class="nav-link text-light" href="#"><i class="bi bi-house-fill"></i></a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Video</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Su Kien</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Xa Hoi</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">The Gioi</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">The Thao</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Viec Lam</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Suc Khoe</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#">Nhan Ai</a>
		    </li>
		    <li class="nav-item">
		      <a class="nav-link text-light" href="#"><i class="bi bi-justify"></i></a>
		    </li>
		  </ul>
	  </div>
	</nav>
	<!-- Header end -->
	<div class="container" style="margin-top: 10px;">
		<div class="row">
			<div class="col-md-9">
				<!-- Section 1 -->
				<div class="row">
					<div class="col-md-7">
						<img src="https://icdn.dantri.com.vn/zoom/996_664/2020/09/21/laymauxetnghiem-141596862548511-1600643450547.jpg" style="width: 100%">
						<h3>Việt Nam thêm 3 ca Covid-19, số ca mắc trên toàn cầu tăng trở lại</h3>
						<p>(Dân trí) - Sáng 3/3, Bộ Y tế thông tin, 3 ca mắc mới Covid-19 gồm một chuyên gia Trung Quốc cách ly sau nhập cảnh tại Bình Dương và 2 người Việt từ nước ngoài nhập cảnh vào Hà Tiên, Kiên Giang.</p>
						<ul>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
						</ul>
					</div>
					<div class="col-md-5">
						<h3>TIN TUC SU KIEN</h3>
						<ul>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
							<li><a href="#">Thay đổi lãnh đạo Chính phủ, Bộ ngành không tái cử Trung ương khóa XIII</a></li>
						</ul>
					</div>
				</div>
				<!-- Section 2 -->
				<div class="row">
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
				</div>
				<div class="row">
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
					<div class="col-md-4">
						<img src="https://icdn.dantri.com.vn/zoom/480_320/2021/02/27/myanmar-1614401833570.jpeg" style="width: 100%">
						<p>Cuộc tranh giành ghế đại sứ Myanmar tại Liên Hợp Quốc</p>
					</div>
				</div>
			</div>
			<div class="col-md-3">
				<img src="https://i.pinimg.com/originals/a7/00/8d/a7008df2fc60ece24a4bae57da754fcf.jpg" style="width: 100%">
				<img src="https://i.pinimg.com/originals/a7/00/8d/a7008df2fc60ece24a4bae57da754fcf.jpg" style="width: 100%">
				<img src="https://i.pinimg.com/originals/a7/00/8d/a7008df2fc60ece24a4bae57da754fcf.jpg" style="width: 100%">
			</div>
		</div>
	</div>
</body>
</html>


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

Danh Sách Bài Học

Đã sao chép!!!