Tạo Chữ Chạy (Marquee) Trong HTML - Học HTML Online - VietTuts

Thẻ embed - Đa phương tiện trong HTML Style Sheet trong HTML

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ẻ <marquee>.

Ghi chú: Thẻ <marquee> này có thể không được hỗ trợ bởi khá nhiều trình duyệt vì thế 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.

Nội dung chính

  • Cú pháp của thẻ marquee trong HTML
  • Các thuộc tính của thẻ <marquee> trong HTML
  • Ví dụ 1: Tạo chữ chạy (Marquee) trong HTML
  • Ví dụ 2: Tạo chữ chạy (Marquee) trong HTML
  • Ví dụ 3: Tạo chữ chạy (Marquee) trong HTML
  • Ví dụ 4: Tạo chữ chạy (Marquee) trong HTML

Cú pháp của thẻ marquee trong HTML

Cú pháp đơn giản để sử dụng thẻ <marquee> như sau:

<marquee attribute_name ="value"....> Một hoặc nhiều dòng văn bản hoặc hình ảnh </marquee>

Các thuộc tính của thẻ <marquee> trong HTML

Bảng dưới đây liệt kê các thuộc tính quan trọng có thể được sử dụng với thẻ <marquee>.

Thuộc tínhMô tả
widthXác định độ rộng của dòng chạy. Giá trị có thể là 10 hoặc 20% ...
heightXác định chiều cao của dòng chạy. Giá trị có thể là 10 hoặc 20% ...
directionXác định chiều hướng mà marquee sẽ được cuốn. Giá trị có thể là up, down, left, hoặc right.
behaviorXác định kiểu cuộn của dòng chạy. Giá trị có thể là scroll, slidealternate.
scrolldelayXác định khoảng thời gian dừng lại khi xong một lần cuốn. Giá trị có thể là 10….
scrollamountXác định tốc độ của dòng chạy. Giá trị có thể là 10….
loopXác định khoảng thời gian của vòng lặp. Giá trị mặc định là INFINITE, nghĩa là các marquee lặp đi lặp lại vô hạn.
bgcolorXác định màu nền, sử dụng tên màu hoặc giá trị thập lục phân của màu.
hspaceXác định khoảng cách chiều ngang của dòng chạy. Giá trị có thể là 10 hoặc 20% ...
vspaceXác định khoảng cách dọc của dòng chạy. Giá trị có thể là 10 hoặc 20% ...

Dưới đây là một số ví dụ tập trung vào cách sử dụng thẻ marquee trong HTML.

Ví dụ 1: Tạo chữ chạy (Marquee) trong HTML

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ví dụ thẻ marquee trong HTML</title> </head> <body> <marquee> Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee. </marquee> </body> </html>

Kết quả:

Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee.

Ví dụ 2: Tạo chữ chạy (Marquee) trong HTML

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ví dụ thẻ marquee trong HTML</title> </head> <body> <marquee width="50%"> Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (width=50%) </marquee> </body> </html>

Kết quả:

Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (width=50%)

Ví dụ 3: Tạo chữ chạy (Marquee) trong HTML

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ví dụ thẻ marquee trong HTML</title> </head> <body> <marquee direction="right"> Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (direction="right") </marquee> </body> </html>

Kết quả:

Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (direction="right")

Ví dụ 4: Tạo chữ chạy (Marquee) trong HTML

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ví dụ thẻ marquee trong HTML</title> </head> <body> <marquee direction="up"> Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (direction="up") </marquee> </body> </html>

Kết quả:

Học HTML tại VietTuts - Ví dụ cách sử dụng thẻ marquee (direction="up") Thẻ embed - Đa phương tiện trong HTML Style Sheet trong HTML

Từ khóa » Hiệu ứng Chữ Chạy Trong Html