Bảng trong HTML
Tag định dạng bảng <TABLE><TR><TD></TABLE>: sử dụng tag <TABLE> để bắt đầu và kết thúc 1 bảng. Sử dụng kèm theo với tag <TR></TR> để thêm 1 dòng trong bảng và tag <TD></TD> để thêm vào 1 ô trên dòng.
Ví dụ:
<TABLE>
<TR><TD>Ô 11<TD>Ô 12
<TR><TD>Ô 21<TD>Ô 22
</TABLE>
Ðể đóng khung cho bảng, sử dụng thuộc tính BORDER
Ví dụ:
<TABLE BORDER=1>
<TR><TD>Ô 11<TD>Ô 12
<TR><TD>Ô 21<TD>Ô 22
</TABLE>
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. Ðể chỉ định chiều rộng các bảng, sử dụng thuộc tính WIDTH=n% để quy định chiều rộng.
Ví dụ:
<TABLE BORDER=1 WIDTH=100%>
<TR><TD>Ô 11<TD>Ô 12
<TR><TD>Ô 21<TD>Ô 22
</TABLE>
Ðể thêm tiêu đề cho bảng, sử dụng tag <CAPTION></CAPTION>. 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>
Ðể thêm vào các ô trải dài trên nhiều cột, dòng khác, dùng thuộc tính COLSPAN=n và ROWSPAN=n.
Ví dụ:
<TABLE BORDER=1 WIDTH=100%>
<CAPTION> Tiêu đề của bảng</CAPTION>
<TR><TD>Ô 11<TD COLSPAN=2>Ô 12 trải dài trên 2 ô
<TR><TD>Ô 21<TD>Ô 22<TD>Ô 23
</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(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.
|
Lập trình 