Thẻ MARQUEE trong HTML

• Trần Thị Vân
• 1641
• 05/07/2025

Chức năng của Thẻ MARQUEE trong HTML

Thẻ MARQUEE trong HTML dùng để làm cho chữ hoặc hình ảnh có hiệu ứng chạy tự động qua lại theo chiều ngang hoặc chiều dọc, chạy từ trái qua phải hoặc ngược lại, chạy từ trên xuống dưới hoặc ngược lại.

Cú pháp của Thẻ MARQUEE trong HTML

<marquee behavior="hanhvi" direction="huong">noidung</marquee>

noidung: Nội dung hiển thị.

huong: Hướng (right: Chạy chữ liên tục từ trái sang phải, left: Chạy chữ liên tục từ phải sang trái, up: Chạy chữ liên tục từ dưới lên, down: Chạy chữ liên tục từ trên xuống)

hanhvi: Hành vi (slide: Chạy từ phải sang trái và dừng lại ở bên trái, alternate: Chạy tự động từ phải sang trái và sau đó chạy ngược lại từ trái sang phải)

Các thành phần có trong thẻ marquee

Thuộc tính direction trong thẻ marquee

<marquee width="100%" direction="right">Chạy chữ liên tục từ trái sang phải</marquee>
<marquee width="100%" direction="left">Chạy chữ liên tục từ phải sang trái</marquee>
<marquee width="100%" direction="up">Chạy chữ liên tục từ dưới lên</marquee>
<marquee width="100%" direction="down">Chạy chữ liên tục từ trên xuống</marquee>

Thuộc tính direction cài đặt được các thành phần right, left, up, down.

Chạy Thử

Thuộc tính behavior alternate trong thẻ marquee

<marquee width="100%" behavior="alternate" bgcolor="red">
Chạy tự động từ phải sang trái và sau đó chạy ngược lại từ trái sang phải.
</marquee>

Chạy tự động từ phải sang trái và sau đó chạy ngược lại từ trái sang phải.

Chạy Thử

Thuộc tính behavior slide trong thẻ marquee

<marquee width="100%" behavior="slide" bgcolor="pink">  
    Chạy từ phải sang trái và dừng lại ở bên trái
</marquee>

Chạy từ phải sang trái nhưng dừng lại ở bên trái, sau đó hiển thị ở bên trái luôn.

Chạy Thử

Các thuộc tính phụ của thẻ marquee

Những lưu ý khi sử dụng thẻ marquee trong HTML

Mặc dù marquee từng được sử dụng phổ biến để tạo hiệu ứng chữ hoặc hình ảnh chuyển động trên trang web, nhưng khi xây dựng website hiện đại cần cân nhắc kỹ trước khi áp dụng. Việc hiểu rõ ưu điểm, hạn chế và cách sử dụng phù hợp sẽ giúp tránh ảnh hưởng đến trải nghiệm người dùng.

Thẻ marquee đã lỗi thời và giải pháp thay thế hiện đại

Thẻ marquee không còn được khuyến khích trong HTML hiện đại vì đây là một phần tử cũ, không nằm trong tiêu chuẩn HTML mới. Một số trình duyệt vẫn hỗ trợ để duy trì khả năng tương thích, nhưng việc phụ thuộc quá nhiều vào thẻ này có thể gây khó khăn khi tối ưu giao diện hoặc mở rộng website.

Hiện nay, hiệu ứng chuyển động nên được tạo bằng CSS Animation hoặc JavaScript. Các phương pháp này giúp kiểm soát tốt hơn về tốc độ, hướng di chuyển, khả năng tương thích trên thiết bị di động và dễ dàng điều chỉnh theo thiết kế tổng thể của website.

Ví dụ, thay vì dùng thẻ marquee để tạo dòng chữ chạy, có thể kết hợp CSS để tạo hiệu ứng linh hoạt hơn:

<div class="moving-text">Nội dung chuyển động trên website</div>

Cách tiếp cận này giúp tách phần nội dung HTML và phần hiệu ứng hiển thị, từ đó website dễ bảo trì, tối ưu tốc độ tải trang và thân thiện hơn với công cụ tìm kiếm.

Khi nào nên sử dụng hiệu ứng chạy chữ trên website

Hiệu ứng chạy chữ vẫn có thể hữu ích trong một số trường hợp cụ thể như hiển thị thông báo ngắn, tin mới, sự kiện nổi bật hoặc các nội dung cần thu hút sự chú ý nhanh. Tuy nhiên, không nên lạm dụng vì chuyển động liên tục có thể khiến người dùng khó đọc thông tin.

Khi sử dụng hiệu ứng này, nên ưu tiên nội dung ngắn gọn, tốc độ di chuyển vừa phải và cho phép người dùng dễ dàng tiếp nhận thông tin. Đối với các website chuyên nghiệp, nên cân nhắc sử dụng các phương án hiển thị hiện đại thay vì tạo quá nhiều chuyển động trên trang.

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Thẻ MARQUEE trong HTML.