BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI
CỘNG HÒA XÃ HÔI CHỦ NGHĨA VIỆT NAM
Độc lập - Tự do - Hạnh phúc
--------------------------------------------------
---------------------------------
NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP
Họ và tên sinh viên: .NGUYỄN DUY VƯƠNG
Số hiệu sinh viên: 09CĐ0639
Khoá:………….Khoa: Điện tử - Viễn thông
Ngành: Điện tử - Viễn thông
1. Đầu đề đồ án:
“HTML và ứng dụng trong thiết kế Website tin tức giải quần vợt
Wimbledon 2012”
2. Các số liệu và dữ liệu ban đầu:
……………………………………..……………………………………………..……..……………………………
……………………………………………………………………………………………………………………………….
…..………………………..…………………………………………………………………………………….
3. Nội dung các phần thuyết minh và tính toán:
………………………………………………………………………………………………………………..….
………………………………………………………………………………………………………………………………
……..….
………………………………………………………………………………………………………………………………
………..….……………………………………………………………………………………………
4. Các bản vẽ, đồ thị ( ghi rõ các loại và kích thước bản vẽ ):
………………………………………………………………………………………………………………………..….
…………………………………………………………………………………………………………………………..
……….………………………………………………………………………………………………………….
5. Họ tên giảng viên hướng dẫn…………………………………………………………...
6. Ngày
giao
nhiệm
vụ
đồ
án………………………………………………………………..
7. Ngày
hoàn
thành
đồ
án…………………………………………………………………………...
Chủ nhiệm Bộ môn
Ngày
tháng
năm
Giảng viên hướng dẫn
Sinh viên đã hoàn thành và nộp đồ án tốt nghiệp ngày
tháng
năm
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
Cán bộ phản biện
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
BỘ GIÁO DỤC VÀ ĐÀO TẠO
TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI
---------------------------------------------------
BẢN NHẬN XÉT ĐỒ ÁN TỐT NGHIỆP
Họ và tên sinh viên: Nguyễn Duy Vương
Số hiệu sinh viên:09CD0639
Ngành: Điện tử - Viễn thông.
Khoá:
Giảng viên hướng dẫn: ThS Nguyễn Quang Minh
Cán bộ phản biện: ………………………………………………………………
1.Nội dung thiết kế tốt nghiệp:
“HTML và ứng dụng trong thiết kế Website tin tức giải quần vợt
Wimbledon 2012”
2.Nhận xét của cán bộ phản biện:
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
.......................................................................................................................................
..............................................................................................................................
Ngày
tháng
năm
Cán bộ phản biện
( Ký, ghi rõ họ và tên )
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
Lời Nói Đầu
*******
Ngôn ngữ đánh dấu siêu văn bản HTML là một phát minh vĩ đại của ngành khoa
học máy tính, từ khi HTML xuất hiện vào cuối thế kỷ XX, con người đã có thể dễ
dàng xuất bản, cập nhật, chia sẻ... tin tức trên nền Internet. Trong đồ án tốt nghiệp
này chúng tôi áp dụng HTML trong việc thiết kế website tin tức giải quần vợt
Wimbledon 2012.
Sau một thời gian tìm tòi nghiên cứu và học hỏi, dưới sự hướng dẫn tận tình của
Thạc Sỹ: Nguyễn Quang Minh em đã nghiên cứu và hoàn thành đề tài “ HTM
và ứng dụng trong thiết kế Website tin tức giải quần vợt Wimbledon 2012”.
Do kiến thức còn han chế nên đề tài chắc chắn không tránh khỏi thiếu sót,vì vậy em
rất mong được sự góp ý nhắc nhở của thầy cô và của các bạn để giúp đề tài
của em ngày một hoàn thiện hơn.
Em xin chân thành cảm ơn thày cô, Viện, đặc biệt là Thạc sỹ: Nguyễn Quang Minh
đã hết sức giúp đỡ và tạo điều kiện cho em hoàn thành tốt đề tài này.
Con xin chân thành cảm ơn bố mẹ đã luôn ở bên và ủng hộ con trong thời gian học
tập và nghiên cứu đồ án.
Cuối cùng xin gởi lời cảm ơn đến bạn bè đã luôn giúp đỡ mình nhiệt tình trong quá
trình học tập cũng như khi nghiên cứu đồ án tột nghiệp.
Sinh viên thực hiện đề tài:
Nguyễn Duy Vương
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
MỤC LỤC
LỜI NÓI ĐẦU
DANH MỤC HÌNH..................................................................................................
DANH SÁCH BẢNG BIỂU.....................................................................................
BẢNG TRA CỨU TỪ VIẾT TẮT..........................................................................
TÓM TẮT ĐỒ ÁN...................................................................................................
MỞ ĐẦU...................................................................................................................
CHƯƠNG 1 : NGÔN NGỮ SIÊU VĂN BẢN HTML..........................................
1.1
Khái niệm cơ bản về HTML.........................................................................
1.2
Thẻ HTML (HTML tag)...............................................................................
1.2.1
Thẻ HTML :.................................................................................................
1.2.2
Phân loại thẻ :...............................................................................................
1.2.3
Thẻ chứa (container tag):..............................................................................
1.2.4
Thẻ rỗng (empty tag) :................................................................................
1.2.5
Thuộc tính của thẻ :....................................................................................
1.2.6
Cấu trúc của tài liệu HTML :......................................................................
1.2.7
Phần đầu tập tin HTML (header) :..............................................................
1.2.8
Phần thân body :.........................................................................................
1.2.9
Màu sắc trong thiết kế trang Web :.............................................................
1.3
Một số thẻ HTML cơ bản :.........................................................................
1.3.1
Phân loại thẻ định dạng :............................................................................
1.3.2
Thẻ định dạng mức khối :...........................................................................
1.3.3
Thẻ định dạng mức văn bản hay trong dòng :.............................................
1.3.4
Phân đoạn văn bản :....................................................................................
1.3.5
Tạo đề mục :...............................................................................................
1.3.6
Định dạng kiểu chữ :..................................................................................
1.3.7
Định dạng font chữ :...................................................................................
1.3.8
Đường kẻ ngang – Thẻ
:..................................................................
1.3.9
Trích dẫn :..................................................................................................
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
1.3.10 Văn bản đã định dạng trước :......................................................................
1.3.11 Thẻ
và :................................................................................
1.3.12 Hình ảnh :...................................................................................................
1.3.13 Âm thanh :..................................................................................................
1.3.14 Đối tượng di chuyển :.................................................................................
1.3.15 Tạo liên kết (link) :.....................................................................................
1.3.16 Các thẻ dùng thiết kế bảng :.......................................................................
1.3.17 Các thẻ tạo Frame :.....................................................................................
1.3.18 Các thẻ dùng tạo Form :.............................................................................
1.3.19 Chú thích :..................................................................................................
1.3.20 Các ký tự đặc biệt :.....................................................................................
1.4
Kết luận chương.........................................................................................
CHƯƠNG 2 : SỬ DỤNG GOOGLE CHROME PHIÊN BẢN TIẾNG VIỆT........
2.1
Giới thiệu về Google Chrome.....................................................................
2.2
Cài đặt Google Chrome và khởi động........................................................
2.3
Cách dùng các tab.......................................................................................
2.3.1
Trang “Tab mới” :......................................................................................
2.3.2
Ghim thẻ tab vào một thanh tab :................................................................
2.3.3
Mở lại những tab đã đóng gần đây :...........................................................
2.3.4
Mở lại toàn bộ các tab trong phiên Chrome trước :....................................
2.3.5
Tách một cửa tab sang sổ mới :..................................................................
2.3.6
Xóa các hình thu nhỏ cụ thể khỏi trang :....................................................
2.4
Cách dùng thanh địa chỉ.............................................................................
2.4.1
đánh dấu một trang web :..........................................................................
2.4.2
Tìm kiếm web :...........................................................................................
2.4.3
Truy cập vào các địa chỉ web :...................................................................
2.4.4
Tìm kiếm dấu trang và lịch sử duyêt web :.................................................
2.4.5
Thêm nút “Trang chủ” vào thanh công cụ :...............................................
2.4.6
Chức năng nút “Điều khiển trang hiện tại” :...............................................
2.4.7
Chức năng nút “Tùy chỉnh và điều khiển Google Chrome” :.....................
2.5
Một số công cụ và tiện ích của Google Chrome.........................................
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
2.5.2
Thanh địa chỉ (Omnibox)/Tìm kiếm :.........................................................
2.5.3
Các ứng dụng web :....................................................................................
2.5.4
Thiết lập thông tin cá nhân và đồng bộ :.....................................................
2.6
Kết Luận Chương.......................................................................................
CHƯƠNG 3 : PHÂN TÍCH THIẾT KẾ WEBSITE TIN TỨC CHO GIẢI
ĐẤU TENNIS WIMBLEDON 2012.......................................................
3.1:
Chi tiết thiết kế Website tin tức giải Wimbledon 2012...............................
3.2.
Kết Luận chương:.......................................................................................
KẾT LUẬN.............................................................................................................
TÀI LIỆU THAM KHẢO........................................................................................
SV: Nguyễn Duy Vương
MSV: 09CĐ0639
Danh Mục Hình
Hình 2.1
Biểu tượng Google trên màn hình nền..................................................
Hình 2.2
Màn hình ban đầu của Google Chrome.................................................
Hình 2.3
Các tab của Google Chrome.................................................................
Hình 2.4
Ghim một thẻ tab vào thanh tab............................................................
Hình 2.5
Mở lại tab đã đóng................................................................................
Hình 2.6
Mở lại toàn bộ tab được mở khi đóng Google Chrome.........................
Hình 2.7
Tách một tab sang cửa sổ mới...............................................................
Hình 2.8
Thêm nút “Trang chủ” vào thanh công cụ.............................................
Hình 2.9
Nút điều khiển trang hiện tại.................................................................
Hình 2.10 Nút tùy chỉnh và điều khiển Google Chrome........................................
Hình 2.11 Google Chrome Properties....................................................................
Hình 2.12 Cửa sổ ẩn danh......................................................................................
Hình 2.13 Tìm kiếm thông qua thanh địa chỉ.........................................................
Hình 2.14 Tính toán từ thanh địa chỉ.....................................................................
Hình 2.15 Thay đổi công cụ tìm kiếm trong thanh địa chỉ.....................................
Hình 2.16 Dán và truy cập một URL nằm ngoài Google Chrome.........................
Hình 2.17 Tìm kiếm nhanh văn bản được chọn trên Google Chrome....................
Hình 2.18 Các ứng dụng web.................................................................................
Hình 2.19 Đăng nhập tài khoản.............................................................................
Hình 2.20
Dữ liệu đồng bộ...................................................................................
Hình 3.1:
Web page 1...........................................................................................
Hình 3.2:
Web page 2...........................................................................................
Hình 3.3:
Web page 3...........................................................................................
Hình 3.4:
Web page 4 (siêu liên kết giữa Web page 2 và 3).................................
Hình 3.5
Web page 5...........................................................................................
Hình 3.6:
Web page 6...........................................................................................
Hình 3.7:
Web page 7...........................................................................................
SV: Nguyễn Duy Vương
1
MSV: 09CĐ0639
Hình 3.8:
Web page8............................................................................................
Hình 3.9:
Web page 9...........................................................................................
Hình 3.10: Web page 10.........................................................................................
Hình 3.11: Web page 11.........................................................................................
Hình 3.12: Web page 12 (Siêu liên kết giữa các Web page từ 5-11).......................
Hình 3.13: Web page 13 ( Siêu liên kết giữa tất cả các Web page đã có ở trên)
..............................................................................................................
SV: Nguyễn Duy Vương
2
MSV: 09CĐ0639
Danh Sách Bảng Biểu
Bảng 1.1 Thẻ và một số thuộc tính cơ bản..................................................
Bảng 1.2: Một số màu cơ bản...................................................................................
Bảng 1.3: Các ký tự đặc biệt....................................................................................
SV: Nguyễn Duy Vương
3
MSV: 09CĐ0639
BẢNG TRA CỨU TỪ VIẾT TẮT
******************
Ký Hiệu
Tiếng Anh
A
ACSII
Alink
B
Active Link
C
CSS
D
Cascading Style Sheets
E
F
G
H
HTML
Hypertext
Mark
Language
I
J
K
L
SV: Nguyễn Duy Vương
4
MSV: 09CĐ0639
M
MB
N
Mega bite
O
P
PX
Q
Pixel
R
RFC1886
S
SGML
T
Standard Generalized Markup Language
U
V
W
WWW
WEB
World Wide Web
Website
TÓM TẮT ĐỒ ÁN
********
Đồ án trình bày những nét cơ bản nhất về ngôn ngữ siêu văn bản HTML và trình
duyệt Web Google Chrome phiên bản tiếng Việt.Ngoài ra còn đề cập đến cách sử
SV: Nguyễn Duy Vương
5
MSV: 09CĐ0639
dụng các thẻ cơ bản trong ngôn ngữ đánh dấu siêu văn bản HTML và một số hướng
dẫn sử dụng Google Chrome. Phần chính của đồ án tập chung vào chi tiết thiết kế
Website tin tức giải quần vợt Wimbledon 2012, bằng cách vận dụng các thẻ cơ bản
trong HTML.
ABSTRACT
********
Scheme presented the most basic features of hypertext language HTML and Google
Chrome Web browser version Viet.Ngoai also mentioned using the cards in the
basic hypertext markup language HTML and some instructions use Google
Chrome. The main part of the project focused on design details Website news:
Wimbledon 2012, by applying the basic HTML tags.
MỞ ĐẦU
***
SV: Nguyễn Duy Vương
6
MSV: 09CĐ0639
Đồ án trình bày những nét cơ bản nhất về ngôn ngữ siêu văn bản HTML và trình
duyệt Web Google Chrome phiên bản tiếng Việt và chi tiết thiết kế Website tin tức
giải quần vợt Wimbledon 2012, bằng cách vận dụng các thẻ cơ bản trong HTML.
Nội dung của đồ án được trình bày trong các chương như sau:
Chương 1: Ngôn ngữ siêu văn bản HTML
Giới thiệu về ngôn ngữ siêu văn bản HTML, vai trò của nó trong việc xây
dựng các website. Các thẻ (tag) và một số thẻ (tag) HTML cơ bản.
Chương 2: Sử dụng Google Chrome phiên bản tiếng Việt
Giới thiệu về Google Chrome. Cách cài đặt, sử dụng các tab, thanh địa chỉ
cùng một số công cụ và tiện ích của Google Chrome.
Chương 3: Phân tích thiết kế website tin tức giải quần vợt Wimbledon 2012
Là một website tự thiết kế sử dụng ngôn ngữ siêu văn bản HTML, nhằm mục
đích cung cấp thông tin về giải quần vợt Wimbledon 2012
SV: Nguyễn Duy Vương
7
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
CHƯƠNG 1 : Ngôn ngữ siêu văn bản HTML
1.1 Khái niệm cơ bản về HTML.
HTML là ngôn ngữ chính để xây dựng các trang website, nó mô tả cách thức 1
trang web hiển thị như thế nào trong 1 trình duyệt. HTML là 1 ngôn ngữ mô tả tài
liệu, được phát triểm từ ngôn ngữ mô tả tài liệu tổng quát SGML (Standard
Generalized Markup Language). HTML ko phải là 1 ngôn ngữ lập trình,nó cung
cấp các chỉ thị định dạng để phụ vụ cho việc trình bày văn bản và các đối tượng
khác như video,hình ảnh..v.v...
HTML (Hypertext Markup Language) là ngôn ngữ định dạng siêu liên kết,cho
phép định dạng văn bản, bổ sung hình ảnh,video,cũng như lưu tất cả vào trong 1 tập
tin dưới dạng văn bản hay dưới dạng ACSII. Các thuật ngữ cơ bản về ngôn ngữ
HTML như sau :
Markup: HTML là ngôn ngữ của các thẻ đánh dấu - Tag. Các thẻ này xác định
cách thức trình bày đoạn văn bản tương ứng trên màn hình.
Language : HTML là một ngôn ngữ tương tự như các ngôn ngữ lập trình, tuy
nhiên đơn giản hơn.Nó có cú pháp chặt chẽ để viết các lệnh thực hiện việc trình
diễn văn bản. Các từ khoá có ý nghĩa xác định được cộng đồng Internet thừa nhận
và sử dụng .Ví dụ b = bold, ul = unordered list, ...
Text : HTML đầu tiên và trước hết là để trình bày văn bản và dựa trên nền
tảng là một văn bản.Các thành phần như hình ảnh , âm thanh, hoạt hình .. đều phải
"cắm neo" vào một đoạn văn nào đó.
Hyper : HTML cho phép liên kết nhiều trang văn bản rải rác khắp nơi trên
Internet. Nó có tác dụng che dấu sự phức tạp của Internet đối với người sử dụng , có
thể đọc mà không cần biết đến văn bản đó nằm ở đâu, xây dựng phức tạp như thế
nào. Sự phát triểm có tính bùng nổ của Internet trong thời gian vừa qua một phần
lớn là nhờ vào WWW.
Hyperlink : dùng để liên kết các tài liệu này đến tài liệu khác hoặc liên kết đối
với bất kì đối tượng nào trên Web như văn bản ,hình ảnh, âm thanh .Chỉ cần click
chuột vào siêu liên kết,tài liệu được liên kết sẽ được hiển thị.
SV: Nguyễn Duy Vương
8
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
1.2 Thẻ HTML (HTML tag)
1.2.1 Thẻ HTML :
Tập tin HTML khác với các tập tin văn bản khác là ở chỗ chúng chứa các mã
đặc biệt, đó là thẻ HTML (HTML tag). Các thẻ này làm nhiệm vụ quy định cách
hiển thị cho nội dung trong trang web.
Thẻ HTML không phân biệt dạng chữ hoa – thường. Dạng tổng quát của một
thẻ HTML thường gồm ba phần:
nội dung
(Thẻ mở)
(Thẻ đóng)
Thẻ mở (opening tag) xác định vị trí bắt đầu có hiệu lực của thẻ.Thẻ mở
được kí hiệu bằng cặp móc nhọn bao quanh tên thẻ.
Ngược lại, thẻ đóng (closing tag) chỉ định vị trí kết thúc hiệu lực của thẻ, kí
hiệu là .
1.2.2 Phân loại thẻ :
Thẻ HTML thường được phân thành hai loại:
Thẻ chứa (container tag)
Thẻ rỗng (empty tag)
1.2.3 Thẻ chứa (container tag):
Mỗi thẻ chứa gồm đầy đủ cặp thẻ đóng và thẻ mở, bao bọc khối văn bản cần
định dạng.
Ví dụ :
Viện Điện Tử Viễn Thông- Trường Đại Học Bách Khoa Hà Nội
Ví dụ này sử dụng thẻ là thẻ đánh dấu chỉ định đoạn văn bản được in
đậm.Trong đó là thẻ mở, chỉ định vị trí bắt đầu đoạn văn bản in đậm, còn
là thẻ đóng chỉ định nơi kết thúc của văn bản được in đậm. Như vậy, câu ví
dụ này khi hiển thị trên trang web sẽ là:
Viện Điện Tử Viễn Thông - Trường Đại Học Bách Khoa Hà Nội
1.2.4 Thẻ rỗng (empty tag) :
SV: Nguyễn Duy Vương
9
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
Bên cạnh những thẻ có cả phần thẻ mở và thẻ đóng là những thẻ chỉ gồm duy
nhất phần thẻ mở, không có thẻ đóng. Các thẻ này được gọi là thẻ rỗng. Do nhiệm
vụ của thẻ đóng là thông báo cho trình duyệt Web vị trí kết thúc hiệu lực của thẻ,
nhưng trong một số trường hợp, trình duyệt có thể tự nhận biết điều này,nên thẻ
đóng không còn cần thiết nữa. Ví dụ thẻ
là thẻ có nhiệm vụ vẽ một đường
ngang theo chiều rộng của tài liệu. Như thế, thẻ không tác dụng lên khối văn bản, vì
vậy cũng không cần phải có thẻ đóng cho biết vị trí kết thúc hiệu lực của thẻ.
1.2.5 Thuộc tính của thẻ :
Khi sử dụng thẻ HTML, trong phần thẻ mở ta có thể sử dụng các thuộc tính thẻ
để bổ sung thêm hiệu quả định dạng.
Các thuộc tính ngăn cách nhau bởi khoảng trắng. Đồng thời, trị của thuộc tính phải
nằm trong cặp nháy kép hay cặp nháy đơn.
Ví dụ:
Viện Điện Tử Viễn Thông
Ví dụ trên sử dụng thẻ kèm theo hai thuộc tính color và size nhằm định dạng
font chữ của chuỗi văn bản Viện Điện Tử Viễn Thông có màu xanh và kích thước 5.
1.2.6 Cấu trúc của tài liệu HTML :
Tài liệu HTML bắt đầu bằng thẻ mở và kết thúc bằng thẻ đóng
:
…………
Thẻ báo cho trình duyệt biết nội dung nằm giữa thẻ mở và
thẻ đóng là một tài liệu HTML.
Phần nội dung được chia thành hai phần:
Phần đầu – header
Phần thân – body
1.2.7 Phần đầu tập tin HTML (header) :
SV: Nguyễn Duy Vương
10
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
Phần đầu chứa thông tin về tài liệu, bắt đầu với thẻ và kết thúc bởi thẻ
đóng .
Trong phần này, ta khai báo tiêu đề của trang bằng thẻ . Tiêu đề không
liên quan gì đến tên tập tin.Ta đặt tiêu đề cho trang web nhằm thể hiện chủ đề của
trang. Khi hiển thị trong trình duyệt, phần tiêu đề đã khai báo sẽ xuất hiện trên
thanh tiêu đề của cửa sổ trình duyệt.
Ví dụ:
Tiêu đề trang web
1.2.8 Phần thân body :
Phần thân là phần chủ yếu của trang web, chứa nội dung hiển thị trong trình
duyệt gồm cả văn bản và hình ảnh. Phần này được bao bọc bởi cặp thẻ và
. Nội dung giữa hai thẻ mở và đóng của thẻ là những gì ta muốn
hiển thị trong trình duyệt.
Thẻ gồm một số thuộc tính như sau:
Thuộc tính
Background
Chỉ định.
Chỉ định một ảnh làm ảnh nền (background) cho văn bản. Giá trị
của thuộc tính này là đường dẫn đến tập tin ảnh.
Nếu kích thước ảnh nhỏ hơn cửa sổ trình duyệt thì ảnh nền này
sẽ được lặp nhiều lần để lấp đầy cửa sổ trình duyệt.
Đặt màu nền cho trang khi hiển thị. Nếu cả hai thuộc tính
BACKGROUND và BGCOLOR cùng được chỉ định thì trình
Bgcolor
Text
duyệt sẽ hiển thị màu nền trước, sau đó mới tải ảnh lên phía trên.
Chỉ định màu chữ của văn bản.
Chỉ định màu sắc cho các siêu liên kết trong văn bản:
Alink
alink (active link) là liên kết đang được kích hoạt.
Vlink
vlink (visited link) là liên kết đã được kích hoạt.
SV: Nguyễn Duy Vương
11
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
link
link là liên kết chưa được kích hoạt.
Bảng 1.1 Thẻ và một số thuộc tính cơ bản
Như vậy, ta có phần khung định dạng một tài liệu HTML như sau:
Tiêu đề trang web
Đây là phần nội dung trang web.
Ví dụ :
Tôi là NGUYỄN DUY VƯƠNG
Đây là website cá nhân của tôi.
1.2.9 Màu sắc trong thiết kế trang Web :
Trong thiết kế Web, màu sắc hiển thị được tổng hợp từ ba thành phần màu
chính:
-
Đỏ (Red)
Xanh lá cây (Green)
Xanh biển (Blue)
Mỗi màu có 256 giá trị, được biểu diễn từ 0 – FF (0 - 255). Trong đó trị 0 thể
hiện mức độ màu thấp nhất, còn FF thể hiện mức độ màu cao nhất. Như vậy kết hợp
giá trị của ba màu, ta nhận được một màu sắc cụ thể, được biểu diễn dưới dạng hexa
với định dạng như sau: #RRGGBB. Trong đó:
-
RR - là giá trị màu Đỏ (0 – FF)
SV: Nguyễn Duy Vương
12
MSV: 09CĐ0639
Chương 1: Ngôn ngữ siêu văn bản HTML
-
GG - là giá trị màu Xanh lá cây (0 – FF)
BB - là giá trị màu Xanh nước biển (0 – FF)
Trong HTML, màu sắc thường được xác định qua các thuộc tính bgcolor hay
color. Giá trị của các thuộc tính này có thể là:
-
Giá trị RGB: #RRGGBB
Tên tiếng Anh của màu.
Tên tiếng Anh chỉ có thể biểu diễn 16 màu, ít hơn nhiều so với số lượng màu
biểu diễn bằng giá trị RGB.
Sau đây là giá trị của một số màu cơ bản:
Màu sắc
Đỏ
Giá trị
#FF0000
Tên tiếng Anh
RED
Xanh lá cây
#00FF00
GREEN
Xanh biển
#0000FF
BLUE
Trắng
#FFFFFF
WHITE
Đen
#000000
Bảng 1.2: Một số màu cơ bản
BLACK
1.3 Một số thẻ HTML cơ bản :
1.3.1 Phân loại thẻ định dạng :
Thẻ định dạng gồm 2 loại sau:
Thẻ định dạng mức khối
Thẻ định dạng mức văn bản hay trong dòng
1.3.2 Thẻ định dạng mức khối :
Đây là các phần tử xuất hiện ở phần thân văn bản. Các phần tử mức khối có tác
dụng thể hiện cấu trúc của tài liệu. Khi các phần tử mức khối bắt đầu ở một dòng
mới, ta không cần ghi thẻ kết thúc.
Một số phần tử mức khối thông thường:
Tiêu đề (H1 đến H6)
Đoạn văn bản (P)
SV: Nguyễn Duy Vương
13
MSV: 09CĐ0639
- Xem thêm -