Chắc bạn không xa lạ với hiệu ứng dòng chữ chạy. Dòng chữ chạy xuất hiện rất nhiều trong đời sống, ví dụ như trong chương trình thời sự, trên các biển quảng cáo, ... Dòng chữ chạy trên web cũng như vậy. Một dòng chữ chạy trong HTML là một phần cuốn văn bản được hiển thị dọc theo chiều ngang hay dọc theo chiều dọc trang của bạn phụ thuộc vào các thiết lập. Nó được tạo ra bằng cách sử dụng thẻ <marquees>.
Ghi chú: Thẻ <marquee> này có thể không được hỗ trợ bởi khá nhiều trình duyệt vì thế chúng tôi đề nghị bạn không nên tin tưởng vào thẻ này. Thay vào đó, bạn có thể sử dụng JavaScript và CSS để tạo ra các hiệu ứng như trên.
Một số các thuộc tính thường dùng của lệnh marquee:
- BGCOLOR= "color" → tạo màu nền cho vùng hiện thị lệnh marquee (có thể dùng hình nền...).
- DIRECTION= "left/right/up/down" → chọn hình thức chạy chữ ( trái, phải, lên, xuống...)
- BEHAVIOR= "scroll/slide/alternate" → thiết lập kiểu chạy chữ .
Scroll → di chuyển tuần tự.- TITLE="message" → Một đọan tin nhắn nhỏ được hiển thị khi người dùng rê chuột vào.
Slide → di chuyện 1 thời gian, sau đó dừng lại.
Alternate → di chuyển từ trái sang phải sau đó dừng lại.
- SCROLLMOUNT="number" → điều chỉnh tốc độ chạy
- SCROLLDELAY="number" → chỉnh thời gian hiển thị (tính bằng giây)
- LOOP="number|-1|infinite" → to manage sum of looping.
- WIDTH="number" → chỉnh độ rộng của vùng chạy chữ. Có thể dùng đơn vị pixel (px) hoặc phần trăm (%).
Ví dụ - 1
<!DOCTYPE html> <html> <head> <title>Vi du the marquee trong HTML</title> </head> <body> <marquee>Hoc HTML tai Genm - Vi du cach su dung the marquee.</marquee> </body> </html>
Nó sẽ tạo ra kết quả là:
Ví dụ 2 :
Code
<marquee align="center" direction="left" height="200" scrollamount="4" width="100%" behavior="alternate">
Chạy chữ qua trái rồi quay lại qua phải (thuộc tính alternate)
</marquee>
Kết quả hiển thị:
Ví dụ 3:
Code
<div align="left"><font face="georgia" color="White"><b><marquee bgcolor="red" width="100%" scrollamount="3" behavior="alternate">
Chạy chữ với màu nền
</marquee></b></font></div>
Kết quả hiển thị:
Ví dụ 4:
Code
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="100%" height="200" align="center">
Di chuyển xuống dưới,
dừng lại khi ta rê chuột vào,
chạy tiếp khi rê chuột ra
</marquee>
Kết quả hiển thị:
Chúc các bạn thành công.
Code
<marquee align="center" direction="left" height="200" scrollamount="4" width="100%" behavior="alternate">
Chạy chữ qua trái rồi quay lại qua phải (thuộc tính alternate)
</marquee>
Kết quả hiển thị:
Ví dụ 3:
Code
<div align="left"><font face="georgia" color="White"><b><marquee bgcolor="red" width="100%" scrollamount="3" behavior="alternate">
Chạy chữ với màu nền
</marquee></b></font></div>
Kết quả hiển thị:
Ví dụ 4:
Code
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="100%" height="200" align="center">
Di chuyển xuống dưới,
dừng lại khi ta rê chuột vào,
chạy tiếp khi rê chuột ra
</marquee>
Kết quả hiển thị:
Chúc các bạn thành công.
0 comments:
Post a Comment