Xem mẫu
- BỘ LAO ĐỘNG - THƯƠNG BINH VÀ XÃ HỘI
TRƯỜNG CAO ĐẲNG NGHỀ KỸ THUẬT CÔNG NGHỆ
-----š›&š›-----
GIÁO TRÌNH
MÔ ĐUN : HTML+CSS
NGHỀ: LẬP TRÌNH VIÊN MÁY TÍNH
TRÌNH ĐỘ: CAO ĐẲNG
Ban hành kèm theo Quyết định số: 13A/QĐ-CĐNKTCN ngày 10 tháng 01 năm 2019
của Hiệu trưởng Trường Cao đẳng nghề Kỹ thuật Công nghệ
Hà Nội, năm 2021
(Lưu hành nội bộ)
1
- TUYÊN BỐ BẢN QUYỀN:
Tài liệu này thuộc loại sách giáo trình nên các nguồn thông tin có thể được phép dùng
nguyên bản hoặc trích dùng cho các mục đích về đào tạo và tham khảo.
Mọi mục đích khác mang tính lệch lạc hoặc sử dụng với mục đích kinh doanh
thiếu lành mạnh sẽ bị nghiêm cấm.
MÃ TÀI LIỆU : MĐLTV 16
2
- LỜI GIỚI THIỆU
HTML/CSS có thể nói là khởi đầu của mọi tất cả vấn đề liên quan tới web, dù
bạn là người làm nghành nào, miễn là có đụng tới quản trị web thì ít nhất phải biết
qua HTML/CSS.
Bạn có thể là một blogger viết rất tốt, nhưng liệu bạn đã sử dụng thành thục các thẻ
HTML và vùng chọn CSS căn bản chưa? Nếu câu trả lời là chưa thì điều đó đang hạn
chế tiềm năng blogging của bạn.
Chương trình khung nghề Lập trình viên máy tính đã được xây dựng trên cơ sở
phân tích nghề, phần kỹ thuật nghề được kết cấu theo các môđun. Để tạo điều kiện
thuận lợi cho các cơ sở dạy nghề trong quá trình thực hiện, việc biên soạn giáo trình
kỹ thuật nghề theo các môđun đào tạo nghề là cấp thiết hiện nay.
Mô đun 16: HTML +CSS là mô đun đào tạo nghề được biên soạn theo hình thức
tích hợp lý thuyết và thực hành. Trong quá trình thực hiện, nhóm biên soạn đã tham
khảo nhiều tài liệu trong và ngoài nước, kết hợp với kinh nghiệm trong thực tế.
Mặc dù có rất nhiều cố gắng, nhưng không tránh khỏi những sai sót, rất mong
nhận được sự đóng góp ý kiến của độc giả để giáo trình được hoàn thiện hơn.
Xin chân thành cảm ơn!
Hà Nội, ngày 23 tháng 04 năm 2021
Tham gia biên soạn
1. Chủ biên Trần Thị Vinh
2. Tập thể Giảng viên Khoa CNTT
Mọi thông tin đóng góp chia sẻ xin gửi về hòm thư tranthivinhvnn@gmail.com hoặc
liên hệ số điện thoại 0978113529
3
- MỤC LỤC
LỜI GIỚI THIỆU .................................................................................................................. 3
MỤC LỤC ............................................................................................................................. 4
BÀI1: TỔNG QUAN VỀ HTML .......................................................................................... 8
1. Giới thiệu internet........................................................................................................... 8
2. Giới thiệu HTML ........................................................................................................... 9
2.1. HTML Development ................................................................................................ 9
2.2. Sử dụng thẻ Metal .................................................................................................. 10
Các ví dụ về thẻ meta trong HTML .................................................................................. 10
2.3. Sử dụng kí tự đặc biệt trong HTML ........................................................................ 10
3. Sử dụng các siêu liên kết .............................................................................................. 19
3.1.Giới thiệu các siêu liên kết và URL ......................................................................... 19
3.2. Sử dụng siêu liên kết .............................................................................................. 20
BÀI 2: CÁC THẺ CƠ BẢN ................................................................................................. 22
1. Headings ...................................................................................................................... 23
2. Các thẻ mức đoạn ............................................................................................................ 25
2.1. Thẻ ....................................................................................................... 25
2.2. Thẻ ............................................................................................... 25
2.3. Thẻ .............................................................................................................. 25
3. Thẻ khối , ............................................................................................... 26
4. Các thẻ định dạng kí tự thường dùng ........................................................................... 26
5. Danh sách ..................................................................................................................... 27
5.1. Danh sách không tuần tự ........................................................................................ 27
5.2. Danh sách có thứ tự ................................................................................................ 27
5.3. Danh sách định nghĩa (danh sach hai cấp) .............................................................. 28
6. Thẻ đường kẻ ngang ..................................................................................................... 28
7. Sử dụng font ................................................................................................................. 28
8. Sử dụng màu sắc ........................................................................................................... 29
9. Thẻ thể hiện hình ảnh IMG ........................................................................................... 29
9.1. Chèn ảnh ................................................................................................................ 29
BÀI 3: SỬ DỤNG BẢNG VÀ LỚP ..................................................................................... 31
1. Cách tạo bảng ............................................................................................................... 31
1.1. Thẻ dùng để tạo bảng -Thẻ Table ........................................................................... 31
1.2. Chèn hàng và cột .................................................................................................... 32
1.3. Xóa hàng và cột ...................................................................................................... 32
1.4. Trộn ô: Kết hợp giữa các cột hay dòng ................................................................... 32
1.5 Định dạng cho ô ...................................................................................................... 33
2.Lớp (Layer) ................................................................................................................... 33
2.1. Lớp là gì ................................................................................................................. 33
2.2. Sử dụng các lớp ...................................................................................................... 34
3. Chèn Multimedia vào tài liệu HTML ............................................................................ 37
3.1. Chèn ảnh động (.Gif) vào tài liệu HTML ................................................................ 37
3.2. Chèn âm thanh vào tài liệu HTML ......................................................................... 37
Các thuộc tính của thẻ ........................................................................................ 37
3.3. Chèn video vào HTML ........................................................................................... 38
3.4. Chèn các Java Applets ............................................................................................ 38
4
- BÀI 4: SỬ DỤNG BIỂU MẪU VÀ KHUNG ...................................................................... 39
1. Giới thiệu biểu mẫu ...................................................................................................... 39
1.1. Sử dụng biểu mẫu ................................................................................................... 39
1.2 Phần tử Form........................................................................................................... 39
1.3. Các phần tử nhập của HTML.................................................................................. 42
1.4. Tạo biểu mẫu .......................................................................................................... 44
2. Khung (Frame) ............................................................................................................. 45
2.1. Tại sao sử dụng khung ............................................................................................ 45
2.2. Sử dụng khung ....................................................................................................... 45
2.3. Phần tử iframe – khung trên dòng (inline frame) .................................................... 47
3. Một số weblayout thường dùng .................................................................................... 47
BÀI 5: CSS (Cascading Style Sheet) .................................................................................... 58
1. DHTML ....................................................................................................................... 58
1.1. Giới thiệu DHTML ................................................................................................ 58
1.2. Các đặc điểm của DHTML ..................................................................................... 58
2. Style sheets ................................................................................................................... 58
2.1. Khái niệm, chức năng và các thuận lợi của stylesheet ............................................. 58
2.2 Quy tắc stylesheet.................................................................................................... 59
3. Các selector trong style sheet ........................................................................................ 59
3.1. Selector đơn ........................................................................................................... 59
3.2. Selector ngữ cảnh ................................................................................................... 60
4. Kết hợp liên kết và chèn một style sheet vào tài liệu HTML ......................................... 60
4.1. Phần tử style ........................................................................................................... 60
4.2. Thuộc tính style ...................................................................................................... 60
5. Thiết lập thuộc tính trong stylesheet ............................................................................. 60
6. Các thuộc tính cơ bản trong CSS .................................................................................. 61
6.1 Thuộc tính background ............................................................................................ 61
6.2 Thuộc tính border .................................................................................................... 61
6.3 Các thuộc tính CSS dành cho text (văn bản) ............................................................ 65
8. Float / Clear .................................................................................................................. 71
5
- GIÁO TRÌNHMÔ ĐUN
Tên mô đun: HTML + CSS
Mã mô đun: MĐLTV 16
Vị trí, tính chất, ý nghĩa và vai trò của mô đun :
- Vị trí: Mô đun HTML+CSS giảng dạy cho sinh viên cao đẳng ngành Lập trình
viên
- Tính chất: Mô đun cung cấp các kiến thức căn bản về HTML và CSS. Học
phần cũng giúp sinh viên tiếp cận với kỹ thuật lập trình web.
Mục tiêu của mô đun:
- Về kiến thức
+ Trình bày được các bước của qui trình thiết kế website.
+ Trình bày các kiến thức cơ bản về các kỹ thuật lập trình web phía Client
với HTML, CSS.
- Về kỹ năng
+ Vận dụng được ngôn ngữ HTML, CSS xây dựng web phía client theo yêu
cầu.
+ Thiết kế được các website theo yêu cầu.
- Về năng lực tự chủ và trách nhiệm:
+ Khả năng tìm tài liệu, đọc hiểu tài liệu
+ Khả năng làm việc nhóm
Nội dung của mô đun:
Thời gian
Số
Tên các bài trong mô đun Tổng Lý Thực Kiểm
TT
số thuyết hành tra*
1 Bài 1: Tổng quan về HTML
1. Giới thiệu Internet
20 3 17
2. Giới thiệu HTML
3. Sử dụng các siêu liên kết
2 Bài 2: Các thẻ HTML cơ bản
1. Headings (tiêu đề)
2. Các thẻ mức đoạn
3. Thẻ khối
4. Các thẻ định dạng ký tự thường
dùng 30 6 23 1
5. Danh sách
6. Thẻ đường kẻ ngang
7. Sử dụng font
8. Sử dụng màu sắc
9. Sử dụng hình ảnh trong HTML
3 Bài 3: Sử dụng bảng và lớp
1. Cách tạo bảng
2. Lớp (Layer) 30 12 17 1
3. Chèn Multimedia vào HTML
6
- 4 Bài 4: Sử dụng biểu mẫu và khung
1. Giới thiệu biểu mẫu(Form)
2. Khung(Frame) 13 3 10
3. Một số weblayout thường
dùng
5 Bài 5: CSS (cascading style sheet)
1. DHTML
2. Style sheets.
3. Các selector trong style sheet
(hay các giả lớp) 25 5 19 1
4. Kết hợp, liên kêt và chèn một
style sheet vào tài liệu HTML
5. Thiết lập thuộc tính trong
stylesheet
Thi kết thúc mô đun 2 1 1
Cộng 120 29 87 4
* Ghi chú: Thời gian kiểm tra lý thuyết được tính vào gìơ lý thuyết, Thời gian
kiểm tra thực hành được tính vào giờ thực hành.
2. Nội dung chi tiết:
7
- BÀI 1: TỔNG QUAN VỀ HTML
Mã bài: MĐLTV 16.01
Giới thiệu:
HTML (viết tắt của Hypertext Markup Language hay ngôn ngữ đánh dấu siêu
văn bản) là ngôn ngữ đánh dấu được dùng để tạo các trang siêu văn bản được sử dụng
trên mạng internet (hay trang web). Gọi là ngôn ngữ đánh dấu là vì HTML sử dụng
các thẻ để định nghĩa (hay đánh dấu) các thành phần khác nhau trên trang web. Siêu
văn bản (hay hypertext) là loại văn bản được sử dụng để hiẹn thị trên các máy vi tính
(hoặc các thiết bị điện tử số). Siêu văn bản khác với văn bản thông thường ở chỗ
chúng được liên kết lại với nhau và có thể được tham chiếu tới nhờ sử dụng các link
liên kết.
Mục tiêu:
Trình bày được những khái niệm cơ bản về internet, HTML
Nắm vững cấu trúc một trang HTML
Trình bày và sử dụng được các siêu liên kết của HTML
Nội dung chính:
1. Giới thiệu internet
Mục tiêu:
- Giới thiệu chức năng, tầm quan trọng của Internet
Internet là gì?
Internet là gì? Internet là mạng toàn cầu bao gồm hàng tỷ máy tính và các
thiết bị điện tử khác. Với Internet, bạn có thể truy cập hầu hết mọi thông tin, giao tiếp
với bất kỳ ai khác trên thế giới và bạn còn làm được nhiều hơn thế nữa.
Bạn có thể làm tất cả điều này bằng cách kết nối máy tính với Internet, hay còn
được gọi là going online. Khi ai đó nói rằng máy tính đang trực tuyến, đó là cách nói
khác chỉ rằng nó đang được kết nối với Internet.
8
- 2. Giới thiệu HTML
2.1. HTML Development
HTML (viết tắt của từ Hypertext Markup Language, hay là "Ngôn ngữ Đánh
dấu Siêu văn bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang
web trên World Wide Web. Cùng với CSS và JavaScript, HTML là một trong những
ngôn ngữ quan trọng trong lĩnh vực thiết kế website. HTML được định nghĩa như là
một ứng dụng đơn giản của SGML và được sử dụng trong các tổ chức cần đến các yêu
cầu xuất bản phức tạp. HTML đã trở thành một chuẩn mực của Internet do tổ chức
World Wide Web Consortium (W3C) duy trì. Phiên bản chính thức mới nhất của
HTML là HTML 4.01 (1999). Sau đó, các nhà phát triển đã thay thế nó bằng XHTML.
Hiện nay, phiên bản mới nhất của ngôn ngữ này là HTML5.
Lưu ý: HTML không phải là ngôn ngữ lập trình.
Bằng cách dùng HTML động hoặc Ajax, lập trình viên có thể được tạo ra và xử
lý bởi số lượng lớn các công cụ, từ một chương trình soạn thảo văn bản đơn giản – có
thể gõ vào ngay từ những dòng đầu tiên – cho đến những công cụ xuất bản
WYSIWYG phức tạp. Hypertext là cách mà các trang Web (được thiết kế bằng
HTML) được kết nối với nhau. Và như thế, đường link có trên trang Web được gọi là
Hypertext. Như tên gọi đã nói, HTML là ngôn ngữ đánh dấu bằng thẻ (Markup
Language), nghĩa là bạn sử dụng HTML để đánh dấu một tài liệu text bằng các thẻ
(tag) để nói cho trình duyệt Web cách để cấu trúc nó để hiển thị
Cấu trúc trang HTML
9
-
2.2. Sử dụng thẻ Metal
Thẻ HTML hay thẻ meta trong HTML được sử dụng để cung cấp
metadata về tài liệu HTML. Metadata sẽ không được hiển thị trên trình duyệt, nhưng
nó sẽ được bộ máy tìm kiếm phân tích để lấy thông tin cơ bản về trang web của bạn.
Thẻ HTML meta được sử dụng để định nghĩa các thông tin cơ bản như mô tả
trang web, từ khóa, tác giả, chỉnh sửa cuối cùng và các metadata khác.
Metadata có thể được sử dụng bởi các trình duyệt (cách hiển thị nội dung hoặc
tải lại trang), bộ máy tìm kiếm (từ khóa), và các dịch vụ web khác.
HTML5 giới thiệu một phương pháp để cho các nhà thiết kế web kiểm soát
khung nhìn (khu vực hiển thị của một người dùng trên trang web), thông qua thẻ
Thẻ meta được định nghĩa trong thẻ
Các ví dụ về thẻ meta trong HTML
Ví dụ 1: định nghĩa các từ khóa cho bộ máy tìm kiếm.
1
Ví dụ 2: định nghĩa một mô tả cho trang web.
1
Ví dụ 3: định nghĩa tác giả của trang web.
1
Ví dụ 4: tự động tải lại trang web sau 30s.
1
Ví dụ 5: Thiết định khung nhìn để trang web dễ nhìn trên tất cả các thiết bị.
1
2.3. Sử dụng kí tự đặc biệt trong HTML
Khi học lập trình HTML, bạn sẽ có cơ hội được thấy các kí tự vô cùng đặc biệt
nhưng không thể thể hiện được nó như các kí tự thông thường trên bàn phím. Để có
thể biểu diễn được các kí tự này trên Website dưới dạng ngôn ngữ lập trình HTML,
chúng ta cần biết các loại mã đặc trưng dành cho chúng. Khi HTML nhìn thấy các loại
mã này, chúng mặc định sẽ chuyển đổi các mã ở cột “HTML” sang hình dạng kí tự
như cột “Symbol” như dưới đây.
Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
SPECIAL CHARACTERS
" “ " quotation mark u+0022 \0022 \42
10
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
ISOnum
u+0023
# # # number sign \0023 \43
ISOnum
u+0024
$ $ $ dollar sign \0024 \44
ISOnum
u+0025
% % % percent sign \0025 \45
ISOnum
u+0026
& & & ampersand \0026 \46
ISOnum
u+0027
' ‘ ' apostrophe \0027 \47
ISOnum
u+0028
( ( ( left parenthesis \0028 \50
ISOnum
u+0029
) ) ) right parenthesis \0029 \51
ISOnum
u+002A
* * * Asterisk \002a \52
ISOnum
u+002B
+ + + plus sign \002b \53
ISOnum
u+002C
, , , Comma \002c \54
ISOnum
u+002D
− – - hyphen-minus \002d \55
ISOnum
u+002E
. . . full stop; period \002e \56
ISOnum
u+002F
/ / / solidus; slash \002f \57
ISOnum
u+003A
: : : Colon \003a \72
ISOnum
u+003B
; ; ; semicolon \003b \73
ISOnum
u+003C
< < < less-than \003c \74
ISOnum
u+003D
= = = Equals \003d \75
ISOnum
greater-than u+003E
> > > \003e \76
sign ISOnum
u+003F
? ? ? question mark \003f \77
ISOnum
at sign; u+0040
@ @ @ \0040 \100
commercial at ISOnum
[ [ [ left square u+005B \005b \133
11
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
bracket ISOnum
u+005C
\ \ \ backslash \005c \134
ISOnum
right square u+005D
] ] ] \005d \135
bracket ISOnum
circumflex u+005E
^ ^ ^ \005e \136
accent ISOnum
u+005F
_ _ _ low line \005f \137
ISOnum
u+0060
` ` ` grave accent \0060 \u0060
ISOnum
left curly u+007b
{ { { \007b \173
bracket ISOnum
u+007c
| | | vertical bar \007c \174
ISOnum
right curly u+007d
} } } \007d \175
bracket ISOnum
u+007e
~ } Tilde \007e \176
ISOnum
LATIN
  no-break space %A0 \00a0 \240
inverted
¡ ¡ ¡ exclamation %A1 \00a1 \241
mark
¢ ¢ ¢ cent sign %A2 \00a2 \242
pound sterling
£ £ £ %A3 \00a3 \243
sign
general
¤ ¤ ¤ %A4 \00a4 \244
currency sign
¥ ¥ ¥ yen sign %A5 \00a5 \245
ȋ Indian Rupee
₹ U+20B9 \20B9 \u20B9
9; (INR) sign
broken
¦ ¦ ¦ %A6 \00a6 \246
(vertical) bar
§ § § section sign %A7 \00a7 \247
umlaut
¨ ¨ ¨ %A8 \00a8 \250
(dieresis)
© © © copyright sign %A9 \00a9 \251
ordinal
ª ª ª indicator, %AA \00aa \252
feminine
« « « angle quotation %AB \00ab \253
12
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
mark, left
¬ ¬ ¬ not sign %AC \00ac \254
­ ­ soft hyphen %AD \00ad \255
® ® ® registered sign %AE \00ae \256
¯ ¯ ¯ Macron %AF \00af \257
° ° ° degree sign %B0 \00b0 \260
plus-or-minus
± ± ± %B1 \00b1 \261
sign
² ² ² superscript two %B2 \00b2 \262
³ ³ ³ superscript three %B3 \00b3 \263
´ ´ ´ acute accent %B4 \00b4 \264
µ µ µ micro sign %B5 \00b5 \265
pilcrow
¶ ¶ ¶ %B6 \00b6 \266
(paragraph sign)
· · · middle dot %B7 \00b7 \267
¸ ¸ ¸ Cedilla %B8 \00b8 \270
¹ ¹ ¹ superscript one %B9 \00b9 \271
ordinal
º º º indicator, %BA \00ba \272
masculine
angle quotation
» » » %BB \00bb \273
mark, right
fraction one-
¼ ¼ ¼ %BC \00bc \274
quarter
fraction one-
½ ½ ½ %BD \00bd \275
half
fraction three-
¾ ¾ ¾ %BE \00be \276
quarters
inverted
¿ ¿ ¿ %BF \00bf \277
question mark
capital A, grave
À À À %C0 \00c0 \300
accent
capital A, acute
Á Á Á %C1 \00c1 \301
accent
capital A,
   ; circumflex %C2 \00c2 \302
accent
à à à capital A, tilde %C3 \00c3 \303
capital A,
Ä Ä Ä dieresis or %C4 \00c4 \304
umlaut mark
13
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
Å Å Å capital A, ring %C5 \00c5 \305
capital AE
Æ Æ Æ diphthong %C6 \00c6 \306
(ligature)
capital C,
Ç Ç Ç %C7 \00c7 \307
cedilla
capital E, grave
È È È %C8 \00c8 \310
accent
capital E, acute
É É É %C9 \00c9 \311
accent
capital E,
Ê Ê Ê circumflex %CA \00ca \312
accent
capital E,
Ë Ë Ë dieresis or %CB \00cb \313
umlaut mark
capital I, grave
Ì Ì Ì %CC \00cc \314
accent
capital I, acute
Í Í Í %CD \00cd \315
accent
capital I,
Î Î Î circumflex %CE \00ce \316
accent
capital I,
Ï Ï Ï dieresis or %CF \00cf \317
umlaut mark
capital Eth,
Ð Ð Ð %D0 \00d0 \320
Icelandic
Ñ Ñ Ñ capital N, tilde %D1 \00d1 \321
capital O, grave
Ò Ò Ò %D2 \00d2 \322
accent
capital O, acute
Ó Ó Ó %D3 \00d3 \323
accent
capital O,
Ô Ô Ô circumflex %D4 \00d4 \324
accent
Õ Õ Õ capital O, tilde %D5 \00d5 \325
capital O,
Ö Ö Ö dieresis or %D6 \00d6 \326
umlaut mark
× × × multiply sign %D7 \00d7 \327
Ø Ø Ø capital O, slash %D8 \00d8 \330
Ù Ù Ù capital U, grave %D9 \00d9 \331
14
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
accent
capital U, acute
Ú Ú Ú %DA \00da \332
accent
capital U,
Û Û Û circumflex %DB \00db \333
accent
capital U,
Ü Ü Ü dieresis or %DC \00dc \334
umlaut mark
capital Y, acute
Ý Ý Ý %DD \00dd \335
accent
capital THORN,
Þ Þ Þ %DE \00de \336
Icelandic
small sharp s,
ß ß ß German (sz %DF \00df \337
ligature)
small a, grave
à à à %E0 \00e0 \340
accent
small a, acute
á á á %E1 \00e1 \341
accent
small a,
â â â circumflex %E2 \00e2 \342
accent
ã ã ã small a, tilde %E3 \00e3 \343
small a, dieresis
ä ä ä %E4 \00e4 \344
or umlaut mark
å å å small a, ring %E5 \00e5 \345
small ae
æ æ æ diphthong %E6 \00e6 \346
(ligature)
ç ç ç small c, cedilla %E7 \00e7 \347
small e, grave
è è è %E8 \00e8 \350
accent
small e, acute
é é é %E9 \00e9 \351
accent
small e,
ê ê ê circumflex %EA \00ea \352
accent
small e, dieresis
ë ë ë %EB \00eb \353
or umlaut mark
small i, grave
ì ì ì %EC \00ec \354
accent
í í í small i, acute %ED \00ed \355
15
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
accent
small i,
î î î circumflex %EE \00ee \356
accent
small i, dieresis
ï ï ï %EF \00ef \357
or umlaut mark
small eth,
ð ð ð %F0 \00f0 \360
Icelandic
ñ ñ ñ small n, tilde %F1 \00f1 \361
small o, grave
ò ò ò %F2 \00f2 \362
accent
small o, acute
ó ó ó %F3 \00f3 \363
accent
small o,
ô ô ô circumflex %F4 \00f4 \364
accent
õ õ õ small o, tilde %F5 \00f5 \365
small o, dieresis
ö ö ö %F6 \00f6 \366
or umlaut mark
÷ ÷ ÷ divide sign %F7 \00f7 \367
ø ø ø small o, slash %F8 \00f8 \370
small u, grave
ù ù ù %F9 \00f9 \371
accent
small u, acute
ú ú ú %FA \00fa \372
accent
small u,
û û û circumflex %FB \00fb \373
accent
small u, dieresis
ü ü ü %FC \00fc \374
or umlaut mark
small y, acute
ý ý ý %FD \00fd \375
accent
small thorn,
þ þ þ %FE \00fe \376
Icelandic
small y, dieresis
ÿ ÿ ÿ %FF \00ff \377
or umlaut mark
LATIN EXTENDED
latin capital u+0152
ΠΠΠ\0152 \u0152
ligature oe ISOlat2
latin small u+0153
œ œ œ \0153 \u0153
ligature oe ISOlat2
Š Š Š latin capital u+0160 \0160 \u0160
16
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
letter s with ISOlat2
caron
latin small letter u+0161
š š š \0161 \u0161
s with caron ISOlat2
latin capital
u+0178
Ÿ Ÿ Ÿ letter y with \0178 \u0178
ISOlat2
diaeresis
latin small f u+0192
ƒ ƒ ƒ \0192 \u0192
with hook ISOtech
SPACING MODIFIER LETTERS
modifier letter
u+02C6
ˆ ˆ circumflex \02c6 \u02c6
ISOpub
accent
u+02DC
˜ ˜ small tilde \02dc \u02dc
ISOdia
GREEK
greek capital
Α Α Α u+0391 \0391 \u0391
letter alpha
greek capital
Β Β Β u+0392 \0392 \u0392
letter beta
greek capital u+0393
Γ Γ Γ \0393 \u0395
letter gamma ISOgrk3
greek capital u+0394
Δ Δ Δ \0394 \u0394
letter delta ISOgrk3
greek capital
Ε Ε Ε u+0395 \0395 \u0395
letter epsilon
greek capital
Ζ Ζ Ζ u+0396 \0396 \u0396
letter zeta
greek capital
Η Η Η u+0397 \0397 \u0397
letter eta
greek capital u+0398
Θ Θ Θ \0398 \u0398
letter theta ISOgrk3
greek capital
Ι Ι Ι u+0399 \0399 \u0399
letter iota
greek capital
Κ Κ Κ u+039A \039a \u039a
letter kappa
greek capital u+039B
Λ Λ Λ \039b \u039b
letter lambda ISOgrk3
greek capital
Μ Μ Μ u+039C \039c \u039c
letter mu
greek capital
Ν Ν Ν u+039D \039d \u039D
letter nu
17
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
greek capital u+039E
Ξ Ξ Ξ \039e \u039e
letter xi ISOgrk3
greek capital
Ο Ο Ο u+039F \039f \u039f
letter omicron
greek capital u+03A0
Π Π Π \03a0 \u03a0
letter pi ISOgrk3
greek capital
Ρ Ρ Ρ u+03A1 \03a1 \u03a1
letter rho
greek capital u+03A3
Σ Σ Σ \03a3 \u03A3
letter sigma ISOgrk3
greek capital
Τ Τ Τ u+03A4 \03a4 \u03A4
letter tau
greek capital u+03A5
Υ Υ Υ \03a5 \u03A5
letter upsilon ISOgrk3
greek capital u+03A6
Φ Φ Φ \03a6 \u03A6
letter phi ISOgrk3
greek capital
Χ Χ Χ u+03A7 \03a7 \u03A7
letter chi
greek capital u+03A8
Ψ Ψ Ψ \03a8 \u03A8
letter psi ISOgrk3
greek capital u+03A9
Ω Ω Ω \03a9 \u03A9
letter omega ISOgrk3
greek small u+03B1
α α α \03b1 \u03b1
letter alpha ISOgrk3
greek small u+03B2
β β β \03b2 \u03b2
letter beta ISOgrk3
greek small u+03B3
γ γ γ \03b3 \u03b3
letter gamma ISOgrk3
greek small u+03B4
δ δ δ \03b4 \u03b4
letter delta ISOgrk3
greek small u+03B5
ε ε ε \03b5 \u03b5
letter epsilon ISOgrk3
greek small u+03B6
ζ ζ ζ \03b6 \u03b6
letter zeta ISOgrk3
greek small u+03B7
η η η \03b7 \u03b7
letter eta ISOgrk3
greek small u+03B8
θ θ θ \03b8 \u03b8
letter theta ISOgrk3
greek small u+03B9
ι ι ι \03b9 \u03b9
letter iota ISOgrk3
greek small u+03BA
κ κ κ \03ba \u03ba
letter kappa ISOgrk3
18
- Numeri CSS JS
HTML Symbol Description Hex
c (ISO) (Octal)
greek small u+03BB
λ λ λ \03bb \u03bb
letter lambda ISOgrk3
greek small u+03BC
μ μ μ \03bc \u03bc
letter mu ISOgrk3
greek small u+03BD
ν ν ν \03bd \u03bd
letter nu ISOgrk3
greek small u+03BE
ξ ξ ξ \03be \u03be
letter xi ISOgrk3
greek small u+03BF
ο ο ο \03bf \u03bf
letter omicron NEW
greek small u+03C0
π π π \03c0 \u03c0
letter pi ISOgrk3
greek small u+03C1
ρ ρ ρ \03c1 \u03c1
letter rho ISOgrk3
greek small
u+03C2
ς ς ς letter final \03C2 \u03c2
ISOgrk3
sigma
greek small u+03C3
σ σ σ \03C3 \u03c3
letter sigma ISOgrk3
greek small u+03C4
τ τ τ \03C4 \u03c4
letter tau ISOgrk3
greek small u+03C5
υ υ υ \03C5 \u03c5
letter upsilon ISOgrk3
greek small u+03C6
φ φ φ \03C6 \03c6
letter phi ISOgrk3
greek small u+03C7
χ χ χ \03C7 \u03c7
letter chi ISOgrk3
greek small u+03C8
ψ ψ ψ \03C8 \u03c8
letter psi ISOgrk3
greek small u+03C9
ω ω ω \03C9 \u03c9
letter omega ISOgrk3
greek small
u+03D1
ϑ ϑ ϑ letter theta \03D1 \u03D1
NEW
symbol
greek upsilon
u+03D2
ϒ ϒ ϒ with hook \03D2 \u03D2
NEW
symbol
u+03D6
ϖ ϖ ϖ greek pi symbol \03D6 \u03D6
ISOgrk3
3. Sử dụng các siêu liên kết
3.1.Giới thiệu các siêu liên kết và URL
Trong HTML, liên kết được xác định bởi cặp thẻ :
19
- text hiển thị
Ví dụ 1
Thăm trang web trường cao đẳng nghề kỹ thuật công
nghệ của chúng tôi
Thuộc tính href xác định địa chỉ đích
3.2. Sử dụng siêu liên kết
Các liên kết cục bộ
Ví dụ trên sử dụng một URL tuyệt đối (Một địa chỉ web đầy đủ).Một liên kết cục
bộ (Liên kết tới các trang web trong cùng một website) được xác định với một URL
tương đối (Không có http://www….).
Ví dụ 2
nguon tai.lieu . vn
