Thiết kế website cho người không biết gì. Chỉ cần vào bước là bạn có thể làm một cái website cho riêng mình. Không tốn kém, chỉ mất có 5 phút là bạn đã biết làm cớ sao không thử.Thiết kế website cho người không biết gì. Chỉ cần vào bước là bạn có thể làm một cái website cho riêng mình. Không tốn kém, chỉ mất có 5 phút là bạn đã biết làm cớ sao không thử.
Trang 1THIẾT KẾ WEBSITE CHO NGƯỜI KHÔNG BIẾT GÌ
1 HTML là phần Nội dung của trang web
CSS là cách Bố trí nội dung trang web
2 Cấu trúc của website
<html>
<head>
<title>tiêu đề của trang </title>
Tìm hiểu thêm google
</head>
<body>
Nội dung trình bày cho web
</body>
</html>
3 Các thẻ trong HTML : Tìm hiểu thêm qua Google
<img src=“địa chỉ hình ảnh” tìm hiểu Google />
<div> trình bày web </div>
<a href= “địa chỉ link”> Liên kết trang </a>
<hr /> đường kẻ ngang
<br /> xuống hàng
<ul>
<li> danh sách liệt kê - dấu chấm tròn </li>
</ul>
4 Dùng CSS bố trí nội dung web
a) Nhúng CSS vào HTML : có 3 cách ( tìm hiểu Google )
Nhúng bằng cặp thẻ <style type="text/css"> </style> vào vị trí bất kỳ của website (tốt nhất là bên trong cặp thẻ <head>)
b) Cách viết của CSS :
Trang 2HTML
<body>A</body>
CSS
<style type="text/css">A</style>
<p>nội dung 1</p>
A
p{Thuộc tính: giá trị;}
<div id= “tên id”>
nội dung 2
</div>
#tên id{Thuộc tính: giá trị;}
<div class= “tên class”>
nội dung 3
</div>
.tên class{Thuộc tính: giá trị;}
<p Styles=“Thuộc tính:giá trị”> ND</p> chỉ có tác dụng trong thẻ
HTML được khai báo
Id Định dạng phần tử có thuộc tính không giống nhau
Chỉ 1 phần tử trong HTML dùng 1 css
class Định dạng phần tử có thuộc tính giống nhau
Nhiều phần tử trong HTML dùng cùng 1 css
c) Các thuộc tính CSS : ( Tìm hiểu thêm Google)
Margin-A:px;
Kc ngoài khung A (Top, Right, Bottom, Left ) Padding- A:px;
Kc trong khung Border:px nét màu;
Viền khung
Background-color:red;
Màu nền Font-size:px;
Kích thước font
Text-decoration:none;
Bỏ ngạch chân trong text Float: Left;
Cố định phần tử về bên trái
Overflow: auto;
chống tràn nội dung
5 Thực hành Website
Dùng Google để tìm hiểu tác dụng của thẻ
Dùng notebook để viết website và lưu với đuôi là HTML
A Tạo bố cục :
Trang 3Tạo bố cục cho web
Tạo bố cục cho phần Banner
Trang 4Tạo bố cục cho phần menu
Tạo bố cục cho phần nội dung
Trang 5Chèn hình ảnh, text vào phần nội dung left
Trang 6Chèn nội dung có cấu trúc giống nhau ( thay id thành class)
Trang 7Thêm nội dung vao phần right
Vậy là xong một Web đơn giản
B Tạo menu cho web