admin
05-11-2009, 11:50 AM
1 trang web viết bằng ngôn ngữ HTML thường bắt đầu bằng <html> và kết thúc bằng </html>
Phần nội dung của trang Web nằm trong phần <body> .... </body>
I)Tạo liên kết
-Tiêu đề(Title) cho trang web :
Code:
<HEAD>
<TITLE>Title cho trang</TITLE>
</HEAD>
-Liên kết thông qua text :
Code:
<A HREF="URL">Text hiển thị liên kết</A>
-Liên kết đến các section trong trang hiện thời :
Tạo ra section:
Code:
<P>
<A HREF="Section">Text miêu tả section.</A>
</P>
-Text liên kết đến section:
Code:
<A NAME="Tên-section">Text để liên kết tới setion</A>
-Liên kết thông qua picture:
Code:
<A HREF="URL">
<IMG SRC="tên file h́nh ảnh"></A>
-Tạo liên kết gốc :
Code:
<BASE HREF="[Only registered and activated users can see links]">II)Các lệnh với chữ :
-Chữ đậm :
Code:
<B>Các chữ cần viết đậm</B>-Chữ nghiêng :
Code:
<I>Các chữ cần viết nghiêng</I>-Chữ gạch chân:
Code:
<U>Các chữ cần gạch chân</U>-Tạo đoạn :
Code:
<P> Các chữ trong đoạn</P>-Viết theo lề:
Code:
<P ALIGHN=Right>Các chữ trong đoạn văn</P>-Xuống ḍng :
Code:
<BR>Chữ cần viết trong ḍng mới
-Chữ ngăn cách bởi gạch ngang :
Code:
<HR>Các chữ ngăn cách với ḍng trên bởi gạch ngang
-Định kích cỡ và độ dài ḍng gạch ngang :
Code:
<HR size=5 with=50%>Text-Tạo heading:
Code:
<H#> ḍng tiêu đề </H#> trong đó # có giá trị nhỏ dần 1 đến 6
-Tạo chú thích:
Code:
<!--Đoạn văn cần chú thích-->-Tạo pre-formated
Code:
<PRE>Đoạn văn ở chế độ pre-formated</PRE-FORMATED>
II)Tạo vùng h́nh ảnh
Tạo image-map (vùng h́nh ảnh)
Code:
<img src="image.gif" usermap='#map_name'>Đặt tên cho vùng <MAP NAME="tên vùng">
Xác định toạ độ cho vùng và h́nh dạng :
Code:
<AREA COORDS="x,y,z,t" SHARP="RECT" HREF="URL">với x,y,z,t là các số nguyên chỉ toạ độ ;
SHARP có thể có các dạng như "RECT","POLY","Circle"
HREF="URL" có nhiệm vụ tạo liên kết đến URL khi ta ấn vào vùng chọn
III)Làm việc với trang:-Tạo mầu nền
Code:
<body bgcolor="rrggbb">với rr,gg,bb là các số tương ứng với tỉ lệ màu đỏ , xanh lá cây , xanh dương
-Lấy ảnh làm nền : khai báo trong phần body :
Code:
background="tên h́nh ảnh nền"
IV)Tạo table:
-Tạo table:
Code:
<TABLE>Nội dung của bảng </TABLE>-Tạo cột :
Code:
<TR> Nội dung của cột </TR>-Thêm nội dung cột :
Code:
<TD> Nội dung </TD>-Tạo heading :
Code:
<TH> heading </TH>-Kích thước lề:
Code:
<TABLE BORDER="Number">....</TABLE>-Độ rộng cột:
Code:
<TABLE WIDTH="Number">....</TABLE>-Tạo tiêu đề:
Code:
<CAPTION> tiêu đề </CAPTION>-Căn giá trị :
Code:
<TABLE Alighn="Kiểu">....</TABLE> trong đó có 3 kiểu: LEFT,RIGHT,CENTER
V)Tạo form:
(Form chứa thông tin để gửi tới server )
-Tạo form:
Code:
<FORM ACTION="_URL_" METHOD="METHOD"> </FORM>Trong đó ACTION="_URL_" chỉ ra server cần gửi thông tin đến
METHOD="METHOD" chỉ ra phương thức gửi POST hoặc GET
+POST là gửi từng phần
+GET là gửi toàn bộ
-Chọn kiểu dữ liệu cho form:
Code:
<FORM ACTION="_URL_" METHOD="METHOD">
<INPUT NAME="name" TYPE="type">
</FORM>
-Kiểu dữ liệu là TEXT:
Code:
<FORM ACTION="_URL_" METHOD="METHOD">
name:<INPUT NAME="name" TYPE="TEXT" SIZE="size" MAXLENGTH="number">
</FORM>Trong đó : SIZE là kích thước text , maxlength là độ dài tối đa của chuỗi kí tự
name là tên của form
-Nhập form text dạng password:
password:
Code:
<INPUT TYPE="PASSWORD" NAME="PASS" SIZE="size">
-Nhập form text dạng ẩn:
hidden:
Code:
<INPUT TYPE="HIDDEN" NAME="HIDDEN" SIZE="size">
-Tạo nút chọn kiểu YES-NO(tạo ra 2 ô để ta đánh dấu lựa chọn):
Code:
<P>Tiêu đề chọn lựa</P><P>
Code:
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
YES</P>Code:
<P>
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
NO</P>
-Tạo check box(có thể chọn nhiều mục bằng cách đánh dấu) :
Ví dụ dưới đây sẽ tạo ra 1 form lựa chọn các kiểu computer mà bạn thích, có thể chọn hơn 1 kiểu:
Code:
<P>Type of Computer</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX" VALUE="CHECKBOX">
PENTIUMII</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX2" VALUE="CHECKBOX">
PENTIUMIII</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX3" VALUE="CHECKBOX">
PENTIUMIV</P>
-Tạo reset form :
Form này có nhiệm vụ xoá các lựa chọn trong check box , đưa check box trở về trạng thái ban đầu:
Đặt form này ngay đằng sau của check box:
Code:
<P>
<INPUT TYPE="RESET" NAME="RESET" VALUE="RESET">
</P>-Gửi thông tin trong form tới server:
Đặt form này ngay đằng sau của check box:
Code:
<P>
<INPUT TYPE="SUBMIT" NAME="SUBMIT" VALUE="SUBMIT">
</P>
-Tạo pop-up menus:
pop-up menus là form có dạng hộp check , khi ta ấn vào hộp th́ các mục trong hộp sẽ hiện ra
Dưới đây sẽ tạo ra pop-up cho 1 form lựa chọn kiểu thanh toán cho khách hàng
Code:
<P ALIGHN="CENTER">Kiểu thanh toán
<SELECT NAME="Seclect">
<OPTION VALUE="C1">Cash</OPTION>
<OPTION VALUE="C2">Cheque</OPTION>
<OPTION VALUE="C3">Creditcard</OPTION>
</SELECT>
</P>
-Tạo list box:
List box cũng giống như text box nhưng chỉ khác ở cách tŕnh bày , nó hiện ra 1 danh sách lựa chọn
Dưới đây sẽ tạo ra 1 danh sách các hệ điều hành cho khách hàng lựa chọn , khách hàng có thể lựa chọn
nhiều hơn 1 hệ điều hành :
Code:
<P ALIGHN="CENTER">Các hệ điều hành
<SELECT NAME="Seclect2" SIZE="5">
<OPTION <WIN 98</OPTION>
<OPTION <WINNT</OPTION>
<OPTION <WINXP</OPTION>
<OPTION <LINUX REDHAT</OPTION>
</SELECT>
</P>
VI)Tạo frames:
Người ta có thể chia trang web ra làm nhiều frame , mỗi frame gần giống như 1 trang web độc lập với nhau ,
tức 1 frame có thể load nội dung mới mà không ảnh hưởng tới các frame c̣n lại ..
-Tạo frame:
Đặt các lệnh sau trong phần <body>....</body>
Code:
<FRAMESET> </FRAMSET>-Tạo frame theo cột:
Code:
<FRAMESET COLS="200,*"> </FRAMSET>Chuỗi lệnh trên tạo ra 2 frame nằm dọc ngăn cách nhau bởi cột 200(tính theo pixe)
Cú pháp lệnh là COLS="number,*"
-Tạo frame theo hàng:
Code:
<FRAMESET ROWS="100,*"> </FRAMSET>Chuỗi lệnh trên tạo ra 2 frame nằm ngang ngăn cách nhau bởi hàng 100
Cú pháp lệnh là ROWS="number,*"
-Làm frame mở ra trang web mới :
Code:
<FRAMESET ROWS="100,*">
<frame src="[Only registered and activated users can see links]">
<frame src="[Only registered and activated users can see links]">
</FRAMSET>Chuỗi lệnh này tạo ra 2 frame nằm ngang phân nhau tại hàng 100 , frame thứ nhất có nội dung là trang
Code:
[Only registered and activated users can see links] , frame thứ 2 có nội dung là trang [Only registered and activated users can see links] .
-Đặt kích thước cho margin(viền) của frame:
Với viền trái hay phải(dùng cho các frame nằm dọc ) :
Code:
MARGINWIDTH="number"Với viền trên hay dưới(dùng cho các frame nằm ngang):
Code:
MARGINHEIGHT="number"number là độ dầy của viền tính theo pixe
-Đặt chức năng cuộn cho frame:
Muốn cho frame có thể cuộn đặt :
SCROLLING="YES"[/code]
Muốn cho frame không thể cuộn đặt :
Code:
SCROLLING="NO"
-ĐẶt liên kết giữa các frame:
Bạn có thể khiến cho 1 frame chứa các mục , khi ta ấn vào 1 mục th́ nội dung của mục đó hiển thị ở frame
kia như sau:
Code:
<A HREF="page1.htm" TARGET="windows_name">Link_text</A>Như vậy khi bạn ấn vào ḍng chữ Link_text ở frame thứ nhất th́ nội dung của trang page1.htm sẽ hiển thị tại
frame thứ 2 .
Phần nội dung của trang Web nằm trong phần <body> .... </body>
I)Tạo liên kết
-Tiêu đề(Title) cho trang web :
Code:
<HEAD>
<TITLE>Title cho trang</TITLE>
</HEAD>
-Liên kết thông qua text :
Code:
<A HREF="URL">Text hiển thị liên kết</A>
-Liên kết đến các section trong trang hiện thời :
Tạo ra section:
Code:
<P>
<A HREF="Section">Text miêu tả section.</A>
</P>
-Text liên kết đến section:
Code:
<A NAME="Tên-section">Text để liên kết tới setion</A>
-Liên kết thông qua picture:
Code:
<A HREF="URL">
<IMG SRC="tên file h́nh ảnh"></A>
-Tạo liên kết gốc :
Code:
<BASE HREF="[Only registered and activated users can see links]">II)Các lệnh với chữ :
-Chữ đậm :
Code:
<B>Các chữ cần viết đậm</B>-Chữ nghiêng :
Code:
<I>Các chữ cần viết nghiêng</I>-Chữ gạch chân:
Code:
<U>Các chữ cần gạch chân</U>-Tạo đoạn :
Code:
<P> Các chữ trong đoạn</P>-Viết theo lề:
Code:
<P ALIGHN=Right>Các chữ trong đoạn văn</P>-Xuống ḍng :
Code:
<BR>Chữ cần viết trong ḍng mới
-Chữ ngăn cách bởi gạch ngang :
Code:
<HR>Các chữ ngăn cách với ḍng trên bởi gạch ngang
-Định kích cỡ và độ dài ḍng gạch ngang :
Code:
<HR size=5 with=50%>Text-Tạo heading:
Code:
<H#> ḍng tiêu đề </H#> trong đó # có giá trị nhỏ dần 1 đến 6
-Tạo chú thích:
Code:
<!--Đoạn văn cần chú thích-->-Tạo pre-formated
Code:
<PRE>Đoạn văn ở chế độ pre-formated</PRE-FORMATED>
II)Tạo vùng h́nh ảnh
Tạo image-map (vùng h́nh ảnh)
Code:
<img src="image.gif" usermap='#map_name'>Đặt tên cho vùng <MAP NAME="tên vùng">
Xác định toạ độ cho vùng và h́nh dạng :
Code:
<AREA COORDS="x,y,z,t" SHARP="RECT" HREF="URL">với x,y,z,t là các số nguyên chỉ toạ độ ;
SHARP có thể có các dạng như "RECT","POLY","Circle"
HREF="URL" có nhiệm vụ tạo liên kết đến URL khi ta ấn vào vùng chọn
III)Làm việc với trang:-Tạo mầu nền
Code:
<body bgcolor="rrggbb">với rr,gg,bb là các số tương ứng với tỉ lệ màu đỏ , xanh lá cây , xanh dương
-Lấy ảnh làm nền : khai báo trong phần body :
Code:
background="tên h́nh ảnh nền"
IV)Tạo table:
-Tạo table:
Code:
<TABLE>Nội dung của bảng </TABLE>-Tạo cột :
Code:
<TR> Nội dung của cột </TR>-Thêm nội dung cột :
Code:
<TD> Nội dung </TD>-Tạo heading :
Code:
<TH> heading </TH>-Kích thước lề:
Code:
<TABLE BORDER="Number">....</TABLE>-Độ rộng cột:
Code:
<TABLE WIDTH="Number">....</TABLE>-Tạo tiêu đề:
Code:
<CAPTION> tiêu đề </CAPTION>-Căn giá trị :
Code:
<TABLE Alighn="Kiểu">....</TABLE> trong đó có 3 kiểu: LEFT,RIGHT,CENTER
V)Tạo form:
(Form chứa thông tin để gửi tới server )
-Tạo form:
Code:
<FORM ACTION="_URL_" METHOD="METHOD"> </FORM>Trong đó ACTION="_URL_" chỉ ra server cần gửi thông tin đến
METHOD="METHOD" chỉ ra phương thức gửi POST hoặc GET
+POST là gửi từng phần
+GET là gửi toàn bộ
-Chọn kiểu dữ liệu cho form:
Code:
<FORM ACTION="_URL_" METHOD="METHOD">
<INPUT NAME="name" TYPE="type">
</FORM>
-Kiểu dữ liệu là TEXT:
Code:
<FORM ACTION="_URL_" METHOD="METHOD">
name:<INPUT NAME="name" TYPE="TEXT" SIZE="size" MAXLENGTH="number">
</FORM>Trong đó : SIZE là kích thước text , maxlength là độ dài tối đa của chuỗi kí tự
name là tên của form
-Nhập form text dạng password:
password:
Code:
<INPUT TYPE="PASSWORD" NAME="PASS" SIZE="size">
-Nhập form text dạng ẩn:
hidden:
Code:
<INPUT TYPE="HIDDEN" NAME="HIDDEN" SIZE="size">
-Tạo nút chọn kiểu YES-NO(tạo ra 2 ô để ta đánh dấu lựa chọn):
Code:
<P>Tiêu đề chọn lựa</P><P>
Code:
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
YES</P>Code:
<P>
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
NO</P>
-Tạo check box(có thể chọn nhiều mục bằng cách đánh dấu) :
Ví dụ dưới đây sẽ tạo ra 1 form lựa chọn các kiểu computer mà bạn thích, có thể chọn hơn 1 kiểu:
Code:
<P>Type of Computer</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX" VALUE="CHECKBOX">
PENTIUMII</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX2" VALUE="CHECKBOX">
PENTIUMIII</P>
<P>
<INPUT TYPE="CHECKBOX" NAME="CHECKBOX3" VALUE="CHECKBOX">
PENTIUMIV</P>
-Tạo reset form :
Form này có nhiệm vụ xoá các lựa chọn trong check box , đưa check box trở về trạng thái ban đầu:
Đặt form này ngay đằng sau của check box:
Code:
<P>
<INPUT TYPE="RESET" NAME="RESET" VALUE="RESET">
</P>-Gửi thông tin trong form tới server:
Đặt form này ngay đằng sau của check box:
Code:
<P>
<INPUT TYPE="SUBMIT" NAME="SUBMIT" VALUE="SUBMIT">
</P>
-Tạo pop-up menus:
pop-up menus là form có dạng hộp check , khi ta ấn vào hộp th́ các mục trong hộp sẽ hiện ra
Dưới đây sẽ tạo ra pop-up cho 1 form lựa chọn kiểu thanh toán cho khách hàng
Code:
<P ALIGHN="CENTER">Kiểu thanh toán
<SELECT NAME="Seclect">
<OPTION VALUE="C1">Cash</OPTION>
<OPTION VALUE="C2">Cheque</OPTION>
<OPTION VALUE="C3">Creditcard</OPTION>
</SELECT>
</P>
-Tạo list box:
List box cũng giống như text box nhưng chỉ khác ở cách tŕnh bày , nó hiện ra 1 danh sách lựa chọn
Dưới đây sẽ tạo ra 1 danh sách các hệ điều hành cho khách hàng lựa chọn , khách hàng có thể lựa chọn
nhiều hơn 1 hệ điều hành :
Code:
<P ALIGHN="CENTER">Các hệ điều hành
<SELECT NAME="Seclect2" SIZE="5">
<OPTION <WIN 98</OPTION>
<OPTION <WINNT</OPTION>
<OPTION <WINXP</OPTION>
<OPTION <LINUX REDHAT</OPTION>
</SELECT>
</P>
VI)Tạo frames:
Người ta có thể chia trang web ra làm nhiều frame , mỗi frame gần giống như 1 trang web độc lập với nhau ,
tức 1 frame có thể load nội dung mới mà không ảnh hưởng tới các frame c̣n lại ..
-Tạo frame:
Đặt các lệnh sau trong phần <body>....</body>
Code:
<FRAMESET> </FRAMSET>-Tạo frame theo cột:
Code:
<FRAMESET COLS="200,*"> </FRAMSET>Chuỗi lệnh trên tạo ra 2 frame nằm dọc ngăn cách nhau bởi cột 200(tính theo pixe)
Cú pháp lệnh là COLS="number,*"
-Tạo frame theo hàng:
Code:
<FRAMESET ROWS="100,*"> </FRAMSET>Chuỗi lệnh trên tạo ra 2 frame nằm ngang ngăn cách nhau bởi hàng 100
Cú pháp lệnh là ROWS="number,*"
-Làm frame mở ra trang web mới :
Code:
<FRAMESET ROWS="100,*">
<frame src="[Only registered and activated users can see links]">
<frame src="[Only registered and activated users can see links]">
</FRAMSET>Chuỗi lệnh này tạo ra 2 frame nằm ngang phân nhau tại hàng 100 , frame thứ nhất có nội dung là trang
Code:
[Only registered and activated users can see links] , frame thứ 2 có nội dung là trang [Only registered and activated users can see links] .
-Đặt kích thước cho margin(viền) của frame:
Với viền trái hay phải(dùng cho các frame nằm dọc ) :
Code:
MARGINWIDTH="number"Với viền trên hay dưới(dùng cho các frame nằm ngang):
Code:
MARGINHEIGHT="number"number là độ dầy của viền tính theo pixe
-Đặt chức năng cuộn cho frame:
Muốn cho frame có thể cuộn đặt :
SCROLLING="YES"[/code]
Muốn cho frame không thể cuộn đặt :
Code:
SCROLLING="NO"
-ĐẶt liên kết giữa các frame:
Bạn có thể khiến cho 1 frame chứa các mục , khi ta ấn vào 1 mục th́ nội dung của mục đó hiển thị ở frame
kia như sau:
Code:
<A HREF="page1.htm" TARGET="windows_name">Link_text</A>Như vậy khi bạn ấn vào ḍng chữ Link_text ở frame thứ nhất th́ nội dung của trang page1.htm sẽ hiển thị tại
frame thứ 2 .