[Series Web Bán Hàng] Bài 2: Tạo khung bố cục cho Web

Ủng hộ AnonyHome Team
Chờ một chút: bạn thấy bài viết có ích chứ? Hãy chia sẻ nó với mọi người nhé!

Chào các bạn đến với bài 2 trong series web bán hàng bằng php chức năng đơn giản của AnonyHome
Trong bài này chúng ta sẽ cùng nhau tạo bố cục cho Website.

[Series Web Bán Hàng] Bài 2: Tạo khung bố cục cho Web AnonyHome

– Tạo một Folder ban_hang trong thư mục htdocs trong xampp của bạn.
– Tạo một file index.php trong Folder ban_hang bạn vừa tạo ở trên.
– Mở file index.php ra bằng một trình soạn thảo bất kỳ. Ở đây mình dùng Sublime Text nhé.
– Bạn sao chép đoạn code sau và dán vào file index ở trên:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Website bán hàng</title>
</head>
<body>
<center>
<table width="990px" border="1">
<tr>
<td colspan="3">Banner</td>
</tr>
<tr>
<td colspan="3">Menu ngang</td>
</tr>
<tr>
<td width="170px">Cột trái</td>
<td width="650px">Cột giữa</td>
<td width="170px">Cột phải</td>
</tr>
<tr>
<td colspan="3">Footer</td>
</tr>
</table>
</center>
</body>
</html>

Ở phần này mình sử dụng thẻ table, tr, td để tạo khung bố cục cho Website. Mình tạo một bảng có độ rộng là 990px và gồm có 4 hàng và 3 cột.
– Hàng thứ nhất mình sẽ để chứa banner.
– Hàng thứ 2 mình sẽ để chứa các menu ngang.
– Hàng thứ 3 sẽ chia làm 3 cột. Và sẽ là phần chính của website.
– Hàng thứ 4 sẽ dùng để chứa footer.
Tiếp theo các bạn lưu file index lại và chạy thử trên một trình duyệt bất kỳ và kết quả nhận được như sau:

[Series Web Bán Hàng] Bài 2: Tạo khung bố cục cho Web AnonyHome

Kết thúc bài 1. Ý kiến thắc mắc vui lòng để lại vào phần bình luận bên dưới. Hẹn gặp các bạn trong bài tiếp theo.

Share
0 0 vote
Vui lòng đánh giá bài viết
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
XEM THÊM
Trong series bài viết này AnonyHome…
0
Bạn thích bài viết chứ? Hãy để lại bình luận.x
()
x