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:
Quote:
<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="http://www.abc.com">
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 ALIGN=Right>Các chữ trong đoạn văn</P>
Ngoài right bạn có thể thay bằng left, center.
-Xuống dòng :
Quote:
<BR>Chữ cần viết trong dòng mới |
-Chữ ngăn cách bởi gạch ngang :
Code:
<HR>Các chữ ngăn cách với dòng trên bởi gạch ngang
-Định kích cỡ và độ dài dòng gạch ngang :
Code:
<HR size=5 with=50%>Text
-Tạo heading:
Code:
<H#> dò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>
III)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
Code:
<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
Thêm Border="0" để bỏ khung, Alt="tùy bạn ghi" để khi rê chuột vào ảnh sẽ hiện text lên.
Vậy 1 thẻ Img sẽ có các tag sau (bạn có thể lược bỏ nếu thấy k cần thiết)
Code:
<img src="image.gif" border="0" alt="tùy bạn ghi" usermap="#map_name"/>
IV)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, hoặc bạn có thể trực tiếp ghi tên màu hoặc mã màu: Green,Blue,... hoặc #000000,..
-Lấy ảnh làm nền : khai báo trong phần body :
Code:
<body background="link hình ảnh nền">
V)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 :
-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 Align="Kiểu">....</TABLE>
trong đó có 3 kiểu: LEFT,RIGHT,CENTER
VI)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>
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
YES</P>
<P>
<INPUT TYPE="RADIO" NAME="RADIOBUTTON" VALUE="RADIOBUTTON">
NO</P>
</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 ALIGN="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 trì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 ALIGN="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="http://www.abc.com/page1.htm">
<frame src="http://www.def.com/page2.htm">
</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
http://www.abc.com/page1.htm , frame thứ 2 có nội dung là trang
http://www.def.com/page2.htm .
-Đặ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 ) : MARGINWIDTH="number"
Với viền trên hay dưới(dùng cho các frame nằm ngang): 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"
Muốn cho frame không thể cuộn đặt : 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 (giống như trang ktlehoan.com) như sau:
Code:
<A HREF="page1.htm" TARGET="windows_name">Link_text</A>
Như vậy khi bạn ấn vào dò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 .