Tạo Thanh Cuộn

Để tạo ra một khung cuộn ta dùng code HTML. Dưới đây là một ví dụ tạo một khung cuộn đơn giản:

<PRE style="BORDER-RIGHT: #009 1px solid; PADDING-RIGHT: 15px;BORDER-TOP: #009 1px solid; PADDING-LEFT: 20px; BACKGROUND: #ff99ff;
OVERFLOW: scroll; BORDER-LEFT: #009 1px solid; WIDTH: 500px; COLOR:
#009; PADDING-TOP: 20px; BORDER-BOTTOM: #009 1px solid; HEIGHT:
150px"><BR></PRE>
 
Hiển thị:

Ghi chú về code trên:

- <PRE style=" ( tag mở tạo khung bao)- BORDER-RIGHT: #009 1px solid; ( khung bao phải), 
- PADDING-RIGHT: 15px; ( đệm phải )
- BORDER-TOP: #009 1px solid; ( khung bao trên), 
- PADDING-LEFT: 20px; ( đệm trái )
- BACKGROUND: #ff99ff; ( màu nền)
- OVERFLOW: scroll; ( thanh cuộn )
- BORDER-LEFT: #009 1px solid; ( khung bao trái)
- WIDTH: 500px; ( chiều rộng của khung cuộn)
- COLOR: #009; ( nền màu của khung cuộn)
- PADDING-TOP: 20px; ( đệm trên)
- BORDER-BOTTOM: #009 1px solid; ( khung bao dưới)
- HEIGHT: 150px ( chièu cao khung cuộn)
- <BR> ( một dòng trống)
- </PRE> ( tag đóng khung bao)

Mỗi thông số có 2 giá trị có thể tuỳ biến là màu của đường viền (border) và to bản của nó. Tại code trên lấy màu là #009 và độ rộng đường là 1px.. Thực ra nếu không cần đặc tả gì thì màu và độ lớn của đường như trên là thông dụng .

Tuỳ biến màu nền:

BACKGROUND: #ff99ff;

Màu nền hiện tại là #ff99ff; Nếu cần màu dịu ta có thể tìm thay bằng màu khác. Ví dụ ta có thể chọn một trong số màu:

 #C6C6FF, #B0FFB0, #E3C8FF, #E1E100, #FFCF9F, #D1D1E9, #FFE1FF vân vân…

Tuỳ biến kích thước của khung:

- WIDTH: 500px; ( chiều rộng của khung cuộn)
- HEIGHT: 150px ( chièu cao khung cuộn)

Tuỳ theo chiều rộng của ngang chuẩn (theo Theme) ta có thể điều chỉnh hai kíchthước của khung sao cho thích hợp. Tuy nhiên không nên cho kích thước ngang (WIDTH) lớn quá sẽ làm dãn trang, mất cân đối của thiết kế chuẩn.

Đặt một nền trang riêng trong khung cuộn:

Chỉ cần lưu ý là code nền trang phải đặt ngay trước tag đóng của khung cuộn </PRE>Ví dụ ta một nền trang riêng có code như sau:

<TABLE style="WIDTH: 445px; HEIGHT: 50px"bgColor=#b7ff6f border=1><TBODY><TR><TD><BR><BR>
</TD></TR></TBODY></TABLE></P>

Khi ta đưa nền vào khung chuẩn thì toàn bộ code sẽ như sau:

<P align=center><DIV align=center><PRE style="BORDER-RIGHT: #009 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #009 1px solid; PADDING-LEFT: 20px;
BACKGROUND: #ff99ff; OVERFLOW: scroll; BORDER-LEFT: #009 1px solid; WIDTH: 500px; COLOR: #009; PADDING-TOP: 20px; BORDER-BOTTOM: #009
1px solid; HEIGHT: 150px"><BR><TABLE style="WIDTH: 445px; HEIGHT: 50px"
bgColor=#b7ff6f border=1><TBODY><TR><TD><BR>
</TD></TR></TBODY></TABLE><P>&nbsp;</P></PRE></DIV></P>

Thể hiện: 

 Lưu ý:1- Khi ta post một dữ liệu nào đó có định dạng chiều ngang lớn vượt giá trị ngang WIDTH khung cuộn thì thanh cuộn ngang sẽ tự động xuất hiện. Để tránh cho người đọc phải dùng thanh cuộn ngang nên chọn giá trị ngang WIDTH khung cuộn thế nào đó cho thích hợp (nhưng nên tránh làm dãn khung chuẩn của trang).
2- Trong Multiply muốn chia sẻ code HTML có thể post qua Reply, PM, hay Guestbook bằng cách đưa code HTML đó vào khung cuộn. Văn bản dạng HTML trong khung cuộn sẽ không bị trường HTML đọc nữa. Do đó code ở bên trong khung cuộn vân nguyên vẹn.