ĐẠI HỌC TIN HỌC Tạo code một shoponline html câu hỏi 6201493
ĐẠI HỌC TIN HỌC Tạo code một shoponline html
Lời giải 1 :
Tham khảo
CODE:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Shop Online</title>
<style>
/* Định dạng trang web */
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
margin: 0;
padding: 0;
}
/* Định dạng tiêu đề */
h1 {
text-align: center;
margin: 20px 0;
}
/* Định dạng danh sách sản phẩm */
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
/* Định dạng mỗi sản phẩm*/
li {
background-color: #fff;
padding: 20px;
margin-bottom: 10px;
border-radius: 5px;
/* Định dạng giá sản phẩm */
.price {
font-weight: bold; }
/* Định dạng nút mua hàng */
.buy-btn {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
text-decoration: none;
border-radius: 5px;
}
/* Định dạng hình ảnh sản phẩm */
img {
max-width: 100%;
height: auto;
}
</style>
</head>
<body>
<h1>Shop Online</h1>
<ul>
<li>
<img src="product1.jpg" alt="Product 1">
<h2>Product 1</h2>
<p class="price">$10</p>
<a href="#" class="buy-btn">Buy Now</a>
</li>
<li>
<img src="product2.jpg" alt="Product 2">
<h2>Product 2</h2>
<p class="price">$20</p>
<a href="#" class="buy-btn">Buy Now</a>
</li>
<li>
<img src="product3.jpg" alt="Product 3">
<h2>Product 3</h2>
<p class="price">$15</p>
<a href="#" class="buy-btn">Buy Now</a>
</li>
</ul>
</body>
</html>
Lời giải 2 :
<!DOCTYPE html>
<html>
<head>
<title>ShopOnline - Đại học Tin học</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: white;
padding: 10px 0;
text-align: center;
}
nav {
background-color: #444;
color: white;
padding: 10px;
}
nav ul {
list-style-type: none;
padding: 0;
margin: 0;
}
nav ul li {
display: inline;
margin-right: 20px;
}
section {
padding: 20px;
}
footer {
background-color: #555;
color: white;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>ShopOnline - Đại học Tin học</h1>
</header>
<nav>
<ul>
<li><a href="#">Trang chủ</a></li>
<li><a href="#">Sản phẩm</a></li>
<li><a href="#">Dịch vụ</a></li>
<li><a href="#">Liên hệ</a></li>
</ul>
</nav>
<section>
<h2>Sản phẩm phổ biến</h2>
<div >
<img src="product1.jpg" alt="Sản phẩm 1">
<h3>Tên sản phẩm 1</h3>
<p>Giá: $100</p>
<button>Mua hàng</button>
</div>
<div >
<img src="product2.jpg" alt="Sản phẩm 2">
<h3>Tên sản phẩm 2</h3>
<p>Giá: $150</p>
<button>Mua hàng</button>
</div>
<!-- ...Thêm các sản phẩm khác tương tự... -->
</section>
<footer>
<p>© 2023 ShopOnline - Đại học Tin học</p>
</footer>
</body>
</html>
Bạn có biết?
Tin học là một ngành khoa học chuyên nghiên cứu quá trình tự động hóa việc tổ chức, lưu trữ, xử lý và truyền dẫn thông tin của một hệ thống máy tính cụ thể hoặc trừu tượng. Tin học bao hàm tất cả các nghiên cứu và kỹ thuật có liên quan đến việc mô phỏng, biến đổi và tái tạo thông tin. Hãy tận dụng sức mạnh của tin học để giải quyết các vấn đề và sáng tạo ra những giải pháp mới!
Nguồn :
Wikipedia - Bách khoa toàn thưTâm sự lớp 12
Lớp 12 - Năm cuối ở cấp trung học phổ thông, năm học quan trọng nhất trong đời học sinh, trải qua bao năm học tập, bao nhiêu kỳ vọng của người thân xung quanh. Những nỗi lo về thi đại học và định hướng tương lai thật là nặng nề. Hãy tin vào bản thân, mình sẽ làm được và tương lai mới đang chờ đợi chúng ta!
Nguồn :
sưu tậpCó thể bạn quan tâm
Tin Học
Lớp 12
Bài 1: Số anh cả Cho số nguyên N (N > 0). M gọi là số anh cả của N nếu M được tạo thành từ các chữ số của N nhưng M lớn nhất. Chẳng hạn: N = 216 thì M = 62 ...Tin Học
Lớp 12
Một xâu chữ cái được gọi là xâu số nếu sau khi xoá một vài kí tự ta thu được một trong các xâu sau: ONE, TWO, THREE, FOUR, FIVE, SIX, SEVEN, EIGHT hoặc NINE. C ...Tin Học
Lớp 12
Bài 3. Mua đồ chơi Tít và Mít đang chơi một trò chơi như sau: Tít chọn các số tự nhiên từ A đến B, Mit chọn các số tự nhiên từ C đến D. Hãy lập trình để đế ...Copyright © 2021 HOCTAPSGK