Ngôn ngữ HTML - Bài thực hành 8 table

Tạo trang web có nội dung là danh sách các món ăn ngon của Hà Nội.

Yêu cầu thiết kế

STT Đối tượng Yêu cầu Hằng số màu
1 Trang web Tiêu đề cửa sổ: Tạo bảng  
2 Nội dung trang web
  • Nền màu vỏ hột gà
  • Hình ảnh: Canh trái
  • Bảng biểu:
    • Dòng tiêu đề: Nền màu nâu đất và chữ màu trắng
    • Màu nền xen kẽ giữa các dòng là màu trắng và màu vỏ hột gà

#FFEDCA

 

#CC6600, #FFFFFF

#FFFFFF, #FFEDCA

Mã nguồn HTML 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<style>
	#img{float:left}
	#pho{width: 150px; height: 150px;margin-top:70px }	
	#table{border: thin #FF9E00; border-collapse:collapse;}
	table, th, td{
    	border:1px solid #FF9E00;
	}
	#b{background-color: orange;}
	#a{background-color: white;}
</style>
<body style="background-color: olive">
<div id="img">
		<img id="pho" src="./img/pho.jpg" >
	</div>
<div id="text">
  <h1 style="color: orange">Các món ngon Hà Nội</h1>
	<table id="table">
		<thead id="table" style="background-color: orange">
				<tr>
					<th style="background-color: orange; color: white">STT</th>
					<th style="background-color: orange; color: white">Tên món</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<th id="a">1</th>
					<th id="a">Bánh cuốn Thanh Trí</th>
				</tr>
				<tr>
					<th id="b">2</th>
					<th id="b">Xôi Hà Nội</th>
				</tr>
				<tr>
					<th id="a">3</th>
					<th id="a">Cả cá Lã Vộng</th>
				</tr>
				<tr>
					<th id="b">4</th>
					<th id="b">Cháo cóc</th>
				</tr>
				<tr>
					<th id="a">5</th>
					<th id="a">Bánh gai Ninh Giang</th>
				</tr>
				<tr>
					<th id="b">6</th>
					<th id="b">Bún thang Hà Nội</th>
				</tr>
				<tr>
					<th id="a">7</th>
					<th id="a">Cá Lằng</th>
				</tr>
				<tr>
					<th id="b">8</th>
					<th id="b">Vịt quây Lạn Sơn</th>
				</tr>
			</tbody>
		</table>
	</div>
</body>
</html>

Xem ví dụ