Nhập môn HTML 2

Chương III

Trình bày: Nguyễn Phú Trường

CÁC THẺ CƠ BẢN

Table với thuộc tính cellpadding

Cellpadding :
số khoảng
trắng từ nội
dung trong ô
dữ liệu đến
đường viền.

24/Oct/2009 2 Bộ môn Mạng máy tính & Truyền thông


Table với thuộc tính cellspacing

Cellspacing :
khoảng cách
giữa các ô
dữ liệu trong
1 bảng.



Table với số cột không bằng nhau



Dữ liệu trong Table



Thẻ danh sách (List)
 Có 3 dạng danh sách chính
 Danh sách có thứ tự (Ordered List) : <ol>
 Danh sách không thứ tự (Unordered List) : <ul>
 Danh sách định nghĩa (Definition Lists) : <dl>
 Danh sách sẽ gồm nhiều phần tử
• Mỗi phần tử trong danh sách được đánh dấu bởi thẻ <li>
• Còn trong danh sách định nghĩa (dl) là : <dt> và <dd>
 Ngoài ra còn có các dạng: <menu> và <dir>
 Có thể định nghĩa các danh sách lồng nhau



Thẻ danh sách (ví dụ)

Danh
sách có
thứ tự
với
nhiều
định
dạng
khác
nhau




Danh
sách
không
thứ tự
với
nhiều
định
dạng
khác
nhau



Thẻ Form
 Lựa chọn dữ liệu nhập từ người sử dụng khi
truy xuất Web,
 Thành phần trong Form: text fields, textarea
fields, drop-down menus, radio buttons,
checkboxes, etc.
 Form được đánh dấu bởi thẻ: <form> …. </form>
• VD : <form name=“Fname" action=“Form-Action”
method=“GET|POST"> …</form>


Ví dụ về Text Field


Ví dụ về Radio Button


Ví dụ về Checkbox


Ví dụ về Submit button



Thẻ Form (ví dụ)



Thẻ Image
 Thêm vào trang web những hình ảnh dưới định
dạng là *.gif hay *.jpg
 Thẻ đánh dấu là : <image src=“URL”>
 Các thuộc tính của thẻ Image
Width = number pixels / number %
Height = number pixels / number %
Align = “left/right/top/middle/bottom”
Alt=“Chuỗi đại diện khi không tải được hình”
 Thẻ <map> và <area>: chia hình ra làm nhiều phần


Thẻ Image (ví dụ)



Thẻ Body - với thuộc tính
 Nền của trang Web có thể được định dạng
Màu nền :
– <body bgcolor="#000000">
– <body bgcolor="rgb(0,0,0)">
– <body bgcolor="black">
Ảnh nền :
– <body background="clouds.gif">
– <body background=“http://www.diachi.net/hinh.jpg">
– <body background=“/bkground.jpg">



Thẻ Body - thuộc tính bgcolor



Thẻ Body - thuộc tính background



Thẻ Head:
 Giữa cặp thẻ <head> và </head> : thông tin về tiêu
đề, địa chỉ nền, styles, meta, font nền, …
 Thông tin khai báo trong thẻ Head không được thể
hiện ra trong nội dung trang Web.
VD :<head>
• <title> Tieu de trang Web </title>
• <link rel="stylesheet" type="text/css“
href="mystyle.css">
• <meta name="keywords" content="HTML">
• </head>



Thẻ Title
 Cung cấp tên tiêu đề trên thanh tiêu đề của trình
duyệt khi thể hiện trang Web.


CÁC THẺ NÂNG CAO

Thẻ Meta:
 Cung cấp thông tin tổng quát về trang Web cho các
Search Engine lưu trữ.
 Mô tả :
• <meta name="description" content=“Trang chu cua Website Khoa
CNTT – Truong DHCT">
 Từ khóa tìm kiếm :
• <meta name="keywords" content=“University, Cantho,
Computer, Information Technology">
 Chỉ định khi hiện trang Web: mở trang Web URL sau 5s
• <meta http-equiv="Refresh“ content="5; url=http://www.cit.ctu.edu.vn">



Thẻ Style
 Xu hướng dùng Style Sheet (CSS) để định dạng
chung cho nhiều trang Web trong Website,
 Có thể định dạng trong file ở ngoài,
VD : <link rel="stylesheet" type="text/css“ href=“abc.css">
 Có thể khai báo bên trong phần <head> trang Web,
VD : <style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
 Có thể sử dụng thẳng trong nội dung trang Web.
VD : <p style="color: red; margin-left: 20px"> Paragraph1 </p>


Thẻ script
 Có thể nhúng vào trang Web những đoạn Script
viết bằng các ngôn ngữ như : JavaScript, VBScript,



Thẻ Font
 Định font cho cả trang Web bằng thẻ <basefont>
 Định font cho 1 đoạn văn bản bằng thẻ <font>



Thẻ Font
 Thường sử dụng thuộc tính style để định dạng font
thay cho các tag cũ.


KẾT LUẬN

 Nhiều thẻ HTML được định nghĩa,
 Thẻ HTML được thay đổi, thêm mới và loại bỏ một số thẻ
cũ bằng các định dạng khác,
 Có thể tham khảo từ : http://www.w3.org
 Hiện nay, còn nhiều định dạng khác được sử dụng rất
nhiều trên Internet, chẳng hạn như :
• XML, XHTML
• WML
• Các kỹ thuật DHTML, CSS, ...

 Ngày nay, thường sử dụng thuộc tính style để định dạng
font thay cho các tag cũ.

Nhập môn HTML 2

More Related Content

What's hot (14)

Similar to Nhập môn HTML 2 (20)

More from Ly hai (20)

Nhập môn HTML 2