1. Trang chủ
  2. » Công Nghệ Thông Tin

Thiết kế website cho người không biết gì

10 257 0

Đang tải... (xem toàn văn)

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 10
Dung lượng 1,39 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Nội dung

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 1

THIẾ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 2

HTML

<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 3

Tạo bố cục cho web

Tạo bố cục cho phần Banner

Trang 4

Tạo bố cục cho phần menu

Tạo bố cục cho phần nội dung

Trang 5

Chèn hình ảnh, text vào phần nội dung left

Trang 6

Chèn nội dung có cấu trúc giống nhau ( thay id thành class)

Trang 7

Thêm nội dung vao phần right

Vậy là xong một Web đơn giản

B Tạo menu cho web

Ngày đăng: 22/06/2016, 13:22

TỪ KHÓA LIÊN QUAN

w