HTML <3> - Các thẻ lệnh tag

Ngôn ngữ HTML dùng thẻ lệnh HTML để thảo nội dung cho một trang mạng . Thẻ Lệnh HTML bao gồm một lệnh HTML nằm giữa hai ký hiệu < > thẻ như sau

<Lệnh HTML>

Nội dung thông tin trên trang mạng thường nằm giửa thẻ lệnh mở đầu <Lệnh HTML> và thẻ lệnh kết thúc </Lệnh HTML> như sau

<Lệnh HTML>Nội Dung Thông Tin</Lệnh HTML>

Nội dung trang mạng được tạo từ nhiều phần tử dưới đây

Chữ hay văn bài (Text)

Hình ảnh (Image)

Liên kết (Link)

Âm nhạc (Multimedia)

Mẩu biểu (Form)

Bảng danh sách, Liệt kê, (Table, List)

Vùng (div), Khung (Frame)

Chúng ta sẽ tìm hiểu một cách khái quát nhất từng lệnh

1. Thẻ Chú Thích / Comment

Cú Pháp

<!--
Chú Thích 1
Chú Thích 2
...........
Chú Thích n
-->

Thí Dụ

<!--
Biên Soạn : Tác Giả
Chức Năng : miêu tả chức năng
-->

2. Thẻ Miêu Tả / Meta Tag

Cú Pháp

<META NAME="Thuộc Tính" CONTENT="Giá Trị"> .

Thẻ Miêu Tả dùng cho những công việc sau :

Dùng để miêu tả trang mạng

Dùng để miêu tả Thông Tin cho Máy Tìm

Dùng để miêu tả Thông Tin Tiêu chuẩn Mã dùng trong trang mạng

Dùng để miêu tả Hiệu Ứng Dùng Trong Trang Mạng

Thẻ Miêu Tả Trang Mạng

<META NAME="Author" CONTENT="Nguyen Dinh Duc Tri">
<META NAME="Keyword" CONTENT="Net,Internet,Vietnamese,Invesment,Tourism">
<META NAME="Description" CONTENT="trung tam chat Luong">
<META NAME="Copy Right" CONTENT="Copy Right 2000. All rights reserved.">
<META NAME=""Resource-Type" CONTENT="Document">
<META NAME="Distribution" CONTENT="Global">

Thẻ Miêu Tả Thông Tin cho Máy Tìm

<meta name="robots" content="index">
<meta name="robots" content="follow">
<meta name="language" content="english, en, Vietnamese,vn"
<meta name="robots" content="all">
<meta name="revisit-after" content="30 days">

Thẻ Miêu Tả Thông Tin Tiêu chuẩn Mã dùng trong trang mạng

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Thẻ Miêu Tả Hiệu Ứng Dùng Trong Trang Mạng

Hiển thị Hiệu Ứng khi vào hoặc khi thoát khỏi trang mạng

Khi vào trang mạng

<meta http-equiv="Page-Enter" content="revealTrans(Duration=Thời_Gian,Transition=Chỉ_Số_Hiệu_Ứng)">

Khi thoát khỏi trang mạng

<meta http-equiv="Site-Exit" content="revealTrans(Duration=Thời_Gian,Transition=Chỉ_Số_Hiệu_Ứng)">

<meta http-equiv="Site-Exit" content="revealTrans(Duration==3.0,Transition=23)">

Trị Số Hiệu Ứng

Có Tất cả 23 Hiệu Úng (effect).
Dùng Hiệu Ứng vi Chỉ_Số_Hiệu_Ứng 23 sẻ được hiệu ứng tự động

3. Thẻ Cơ sở / Base

Thẻ này dùng để khai nền chung cho các Liên kết, khung, kiểu chữ ....

Công thức của thẻ cơ sở:

<Base Target=_Top|_Blank|_Self>
<Base Href=http://www.Tên_Miền.com/>
<Base Font= PhongChu </base>

Trong đó:

Base target : Khung để hiển thị các liên kết trang mạng
Base Href : Tên Miền dùng cho các liên kết trang mạng
Base Font : Kiểu chữ dùng chung cho toàn trang mạng

Ví dụ:

4. Kiểu Chữ / Text Style

Thẻ định nghĩa kiểu chữ

Thí Dụ : <strong>Kiểu chử đậm</strong>
Hiển Thị : Kiểu chử đậm

Thí Dụ : <em>Kiểu chử nghiêng</em>
Hiển Thị : Kiểu chử nghiêng

Thí Dụ : <strike>Kiểu chử gạch ngang</strike>

Hiển Thị : ~~Kiểu chử gạch ngang~~

Thí Dụ : A<sub>Kiểu chử nằm dưới </sub>

Hiển Thị : A_{Kiểu chử nằm dưới}

Thí Dụ : A<sup>Kiểu chử nằm trên</sup>

Hiển Thị : A^{Kiểu chử nằm trên}

<b></b>

Thí Dụ : <b>Kiểu chử đậm</b>

Hiển Thị : Kiểu chử đậm

<i></i>

Thí Dụ : <i>Kiểu chử ngiên</i>

Hiển Thị : Kiểu chử đậm ngien

<u></u>

Thí Dụ : <u>Kiểu chử gạch dưới</u>

Hiển Thị : Kiểu chử gạch dưới

<s></s>

Thí Dụ : <s>Kiểu chử nhỏ</s>

Hiển Thị : ~~Kiểu chử nhỏ~~

Thẻ output (Computer Output)

< code > Mô tả Chữ kiểu đoạn mã Computer
< kbp > Mô tả Chữ kiểu bàn phím
< samp > Mô tả Chữ kiểu samp
< tt > Mô tả Chữ kiểu điện tín
< var > Mô tả Chữ kiểu dạng Biến
< pre > Mô tả Hiển thị không biên dịch
< listing > Mô tả Giống thẻ pre
< plaintext > Mô tả Giống thẻ pre
< xmp > Mô tả Giống thẻ pre

Thẻ định nghĩa - Lời trích dẫn

< abbr > Giải thích chữ viết tắt
< kbp > Giải thích chữ viết tắt
< samp > Hiển thị thông tin địa chỉ
< tt > Lời hướng dẫn
< var > Đoạn trích dẫn dài
< pre > Dòng trích dẫn
< listing > Đoạn trích dẫn
< plaintext > Thành ngữ

5. Tiêu Đề / Text Header

Thẻ này dùng để định dạng kiểu chữ của tiêu đề.

Công Thức

<h1> Tiêu Đề Chử Cấp 1 (To Nhất)</h1>
<h2> Tiêu Đề</h2>
<h3> Tiêu Đề</h3>
<h4> Tiêu Đề</h4>
<h5> Tiêu Đề</h5>
<h6> Tiêu Đề Chử Cấp 6 (Nhỏ Nhất)</h6>

Thí Dụ

<h1> Tiêu Đề Chữ Cấp 1 (To Nhất) </h1>
<h2> Tiêu Đề </h2>
<h3> Tiêu Đề </h3>
<h4> Tiêu Đề </h4>
<h5> Tiêu Đề </h5>
<h6> Tiêu Đề Chử Cấp 6 </h6>

6. Hình Ảnh / Image

Thẻ lệnh HTML để chèn hình trong trang mạng

Công Thức

<Img Src=tên_hình.gif
Width=Chiều Dài
Height=Chiều Cao
Alt=Miêu Tả
Border=Viền
Hspace=Khỏang_Cách_Chiều_Cao
Vspace=Khỏang_Cách_Chieu_Dài >

Thí Dụ

<img src=Hinh.gif alt=Hình Tôi align=middle hspace=5 vspace=5>Hình</a>

7. Liên Kết / A Href

Để tạo Liên Kết đến một trang mạng , hoặc một mục của trang mạng trên mạng WWW.

Công Thức

Liên Kết Đến Một Trang Mạng

<a Href=http://www.TenMien.TenTrangMang.htm#A

Target=Nơi_Hiển_Thị_Trang_Mạng>Miêu tả Liên Kết</a>

Liên Kết Đến Một Mục trong Trang Mạng

<a Href=Tên_Trang_Mạng.htm#A>A

Thí Dụ

Tạo một liên kết đến một trang mạng

<a href==http://www.geocities.com/index.htm TARGET=_blank>Trang mạng geocities</a>

Trang mạng geocities

Tạo một liên kết đến một mục trong trang mạng

<a href=index.htm#A>A</a>

A

8. Nhạc Nền / Bgsound

Để nhúng nhạc nền (background sound) vào trong trang mạng. Có thể gây khó chịu cho người xem hoặc làm giảm tốc độ truy cập mạng.

Đối với trình duyệt Internet Explorer

Công thức

<bgsound src="tên_nhạc.wav" loop=="infinite / 1, 2, 3, ..."=>=

với loop="..." số lần bài hát lặp lại

Thí dụ: <bgsound src="ding.wav">

Đối với trình duyệt Firefox, Netscape, Opera, Safari

Công thức

<embed src="tên_nhạc.wav" autostart="true">

Thí dụ: <embed src="ding.wav" autostart="true">

9. Danh Sách / List

Thẻ lệnh HTML tạo bảng danh sách các đề tài. Bao gồm:
* 1 Danh sách thứ tự (ordered list)
* 2 Danh sách không thứ tự (unordered list)
* 3 Danh sách định nghĩa (definition list)

Danh sách thứ tự (ordered list)

Công thức

Cơ bản:
<ol>
<li>Đề tài 1</li>
<li>Đề tài 2</li>
</ol>

Đầy đủ:
<ol type="1 / A / a / I / i" start="1, 2, 3, ...">
<li>Đề tài 1</li>
<li value="1, 2, 3, ...">Đề tài 2</li>
</ol>

Thí dụ:
<ol>
<li>Cái chày</li>
<li>Cái cối</li>
</ol>

Kết quả:

Cái chày

Cái cối

<ol type="A">
<li>Cái chày</li>
<li>Cái cối</li>
</ol>
Kết quả

Cái chày

Cái cối

<ol start="5">
<li>Cái chày</li>
<li>Cái cối</li>
</ol>
Kết quả

Cái chày

Cái cối

<ol>
<li value="123">Cái chày</li>
<li>Cái cối</li>
<li value="2">Cái bát</li>
</ol>
Kết quả

Cái chày

Cái cối

Cái bát

Danh sách không thứ tự (unordered list)

Công thức

Cơ bản:

<ul>
<li>Đề tài 1</li>
<li>Đề tài 2</li>
</ul>

Đầy đủ:

<ul type="disc / circle / square">
<li>Đề tài 1</li>
<li type="disc / circle / square">Đề tài 2</li>
</ul>

Thí dụ

<ul>
<li>Cái chày</li>
<li>Cái cối</li>
</ul>

Kết quả:

Cái chày

Cái cối

<ul type="circle">
<li>Cái chày</li>
<li type="square">Cái cối</li>
</ul>

Kết quả:

Cái chày

Cái cối

Danh sách định nghĩa (definition list)

Công thức

<dl>
<dt>Thuật ngữ 1</dt>
<dd>Định nghĩa 1</dd>
<dt>Thuật ngữ 2</dt>
<dd>Định nghĩa 2</dd>
</dl>

Thí dụ

<dl>
<dt>Tin học</dt>
<dd>Nghiên cứu việc xử lý thông tin trên máy tính</dd>
<dt>Computer</dt>
<dd>Dùng thực hiện tự động các phép tính</dd>
</dl>
Kết quả

Tin học: Nghiên cứu việc xử lý thông tin trên máy tính
Computer: Dùng thực hiện tự động các phép tính

10. Bảng / Table

Bảng tạo bởi nhiều dòng, cột và bao gồm nhiều ô nhỏ có thể chứa dữ liệu,hình ảnh ..

Cấu trúc

<table border="1">
<tr>
<td>dòng 1, ô 1</td>
<td>dòng 1, ô 2</td>
</tr>

<tr>
<td>dòng 2, ô 1</td>
<td>dòng 2, ô 2</td>
</tr>
</table>

Thuộc Tính

Border :Ðể xác định đường kẻ khung cho bảng

Ví dụ:
<TABLE BORDER=1>
<TR><TD>Ô 11<TD>Ô 12
<TR><TD>Ô 21<TD>Ô 22
</TABLE>

Kết quả

Ô 11	Ô 12
Ô 21	Ô 22

Width(Chiều rộng) mặc định của bảng sẽ là chiều rộng lớn nhất của dòng rộng nhất trong bảng. WIDTH=n% để quy định chiều rộng.
CAPTION(Tiêu Đề). Mặc định tiêu đề của bảng nằm ở trên và canh lề giữa. Tuy nhiên có thể thay đổi bằng cách dùng thuộc tính ALIGN bên trong CAPTION.

Ví dụ:
<TABLE BORDER=1 WIDTH=100%>
<CAPTION> Tiêu đề của bảng</CAPTION>
<TR><TD>Ô 11<TD>Ô 12
<TR><TD>Ô 21<TD>Ô 22

</TABLE>

Ðịnh nghĩa TABLE(bảng):
<TABLE
ALIGN=align-type
BACKGROUND=url
BGCOLOR=color-type
BORDER=n
CELLPADDING=n
WIDTH=n%>
Trong đó:
ALIGN=align-type: lề của bảng, có giá trị là LEFT hoặc RIGHT
BACKGROUND=url: chỉ định ảnh nền của bảng
BGCOLOR=color-type: màu nền của bảng
BORDER=n: đường viền bảng, n tính bằng pixel
CELLPADDING=n: khoảng cách từ ô tới nội dung của ô, đơn vị pixel
WIDTH=n: độ rộng của bảng, n tính theo % (phải có dấu % theo sau)

Ðịnh nghĩa TR(xuong dòng):
<TR
ALIGN=align-type
BACKGROUND=url
BGCOLOR=color-type
VALIGN=v-align-type>
Trong đó:
ALIGN=align-type: lề của các ô trong dòng, có giá trị là LEFT, RIGHT hoặc CENTER
BACKGROUND=url: chỉ định ảnh nền của dòng
BGCOLOR=color-type: màu nền của dòng
VALIGN=v-align-type: lề theo chiều dọc cho văn bản trong các ô trên dòng. Giá trị có thể là: TOP, BOTTOM, MIDDLE.

Ðịnh nghĩa TD (ô):
<TD
ALIGN=align-type
BACKGROUND=url
BGCOLOR=color-type
COLSPAN=n
ROWSPAN=n
VALIGN=v-align-type>
Trong đó:
ALIGN=align-type: lề văn bản trong ô, có giá trị là LEFT, RIGHT hoặc CENTER
BACKGROUND=url: chỉ định ảnh nền cho ô
BGCOLOR=color-type: màu nền của ô
COLSPAN=n: ô trải rộng trên n cột
ROWSPAN=n: ô trải dài trên n hàng
VALIGN=v-align-type: lề theo chiều dọc cho văn bản trong các ô . Giá trị có thể là: TOP, BOTTOM, MIDDLE.
TH: tạo ô tiêu đề. Tương tự như TD chỉ khác là văn bản được thể hiện ở dạng nghiêng.

11. Sửa đổi Nhúng / Embed

Sẽ trình bày cụ thể, vì thể này tương đối phức tạp.

12. Trình Bổ Sung / Java Applets

Trình bổ sung Java được viết bởi trình soạn thảo Java để thực thi một việc như Trò chơi, xem nhac hình và được dùng trong trang mạng bằng thẻ lệnh <applet>
</applets>

Cú Pháp

<APPLET>
CODE="***" Applet Code
CODEBASE="url " Applet Code Source
NAME="***" Applet Name
ALT="***" Alternate Text for Applet
ALIGN="***" Applet Alignment
WIDTH="?" Applet Window Width in pixels
HEIGHT="?" Applet Window Height (also in pixels)
VSPACE="?" Top And Bottom Margin Width
HSPACE="?" Side Margin Width
</APPLET>

Thí Dụ

<APPLET> Tag Attributes
PARAM NAME="***" Name of Parameter in Applet
CODE="***" Applet Code
CODEBASE="url " Applet Code Source
NAME="***" Applet Name
ALT="***" Alternate Text for Applet
ALIGN="***" Applet Alignment
WIDTH="?" Applet Window Width in pixels
HEIGHT="?" Applet Window Height (also in pixels)
VSPACE="?" Top And Bottom Margin Width
HSPACE="?" Side Margin Width
APPLET Under Construction!!

13. Mục / A Name

Để tạo một mục đề trong trang mạng tương tợ như tạo một Mục Lục

Công Thức

<a name=#Tên_Mục>Mục

Thí Dụ

<a href=#A>A</a> | <a href=#A>A</a> |<a href=#A>Z</a> | <a name=#A> A <a name=#B> B <a name=#Z> Z

<a href=#A>A</a> | <a href=#A>A</a> |<a href=#A>Z</a> | <a name=#A> A <a name=#B> B <a name=#Z> Z

14. Khung / Frame

Thẻ lệnh ngôn ngử HTML dùng để chia Cửa Sổ thành nhiều Khung

Công Thức

<frameset (cols=20%,*|rows=20%,*)>
<frame src=Tên_khung target=Đích src=Địa_Chỉ_Trang_Mạng>
<frame src=Tên_khung target=Đích src=Địa_Chỉ_Trang_Mạng>
</frame>

Thí Dụ

<frameset cols=20%,*>
<frame src=muc_luc target=noi_dung src=http://www.geocities.com/left.htm>
<frame src=noi_dung scr=http://www.geocities.com/right.htm>
</frame>

15. Vùng / Div

Thẻ Lệnh HTML dùng để chia văn bản ra thành vùng

Công Thức

Hiệu Ứng (Effect)

<div name = Any_Name
position = Absolute|Relative
align=Left|Center|Right
bgcolor=#RGB|Color
top=px|%
left=px|%
</div>

Chỉ_Số_Hiệu_Ứng (Value)

<div Vị Trí = Tuyệt Đối|Tương Đối
Tên = Tên
Xếp = Trái|Trung Tâm|Phải
Màu_Nền = Màu|Trị Số Màu
Độ_Xuống_Từ_Trên = px|%
Độ_Ngang_Từ_Trái = px|%
</div>

16. Lệnh Khác

* <center></center> Mở và kết Vô Trung Tâm

* <p></p> Mở và kết một dải chử

* <br> Xuống Dòng

* <hr align=Xếp color=Màu size=Cở width=Chiều_Dài NOSHADE> Kẻ Hàng

* <pre></pre> Mở và kết Hiển thị chử theo định dạng của chử

* <xmp></xmp> Mở và kết Hiển thị mả nguồn của trang mạng

* <font size=Cở(5|+2) color=Màu(black|#000) Face=Tên_Phông_Chử((Arial|Verdana)></font> Mở và kết Định dạng phong chử dùng trong toàn trang mạng

Trên đây là các sưu tập của tôi trên mạng vừa để học, vừa để post lên cho các bạn tham khảo. Chắc chắn còn nhiều thiếu sót, nhưng hy vong có ích cho các bạn.

About Chinhnd

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.

Menu

Sponsor

HTML <3> - Các thẻ lệnh tag

About Chinhnd

0 nhận xét :

Post a Comment

Menu

Sponsor

HTML <3> - Các thẻ lệnh tag

About Chinhnd

RELATED POSTS

0 nhận xét :

Post a Comment