Cara menggunakan cara membuat teks html

Anda pasti pernah melihat running text di beberapa media seperti website, TV (umumnya di bagian bawah layar) dan lain sebagainya.

Tentunya running text membuat anda tertarik untuk membacanya sekaligus bertanya-tanya bagaimana cara membuat running text seperti itu

Pada umumnya running text pada sebuah website digunakan sebagai media notifikasi, informasi singkat, atau hiburan (hiasan). Membuat running text tidaklah sulit karena kita hanya perlu memanfaatkan elemen yang disediakan oleh HTML

Daftar isi

Cara Membuat Skrip Berfungsi di HTML

HTML menyediakan elemen khusus yang disebut marquees. Untuk lebih jelasnya mari kita lihat penjelasan cara menulis dalam HTML di bawah ini

1. Elemen tenda

Elemen marquee digunakan untuk membuat teks atau media lain (seperti gambar atau video) bergerak baik secara horizontal maupun vertikal. Saat ini beberapa browser tidak lagi mendukung elemen marquee sehingga elemen ini jarang digunakan

Dibandingkan menggunakan marquee, Anda disarankan untuk menggunakan Javascript dan CSS. Namun kali ini kita akan membahas penggunaan HTML marquee

Untuk dapat membuat teks berjalan, Anda dapat menggunakan pasangan tag Isi teks disini. Pada tag juga terdapat beberapa atribut seperti :

2. Atribut lebar dan tinggi

Atribut width digunakan untuk menentukan lebar elemen marquee dengan nilai numerik yang dapat dituliskan seperti 18, 15% atau 30px. Sedangkan atribut height digunakan untuk menentukan tinggi elemen marquee dengan nilai numerik yang sama dengan width yaitu 18, 15% atau 30px.

Berikut adalah contoh kode penulisan lebar dan tinggi pada HTML

<!DOCTYPE html>
 <html>
 <head>
  <title>Atribut Width dan Height di Tag Marquee</title>
 </head>
 <body>
  <marquee width="500" height="40">Teks ini berjalan</marquee>
 </body>
 </html>

Setelah Anda menjalankan kode di atas pada browser, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

Jika tidak memberikan pengaturan lebar dan tinggi maka lebar secara default adalah 100% (lebar penuh jendela browser) dan tinggi menyesuaikan dengan tinggi konten

Berikut adalah contoh kode yang ditulis dalam HTML

<!DOCTYPE html>
<html>
 <head>
  <title>Default Width dan Height di Tag Marquee</title>
 </head>
 <body>
  <marquee>Teks ini berjalan</marquee>
 </body>
</html>
_

Setelah Anda menjalankan kode HTML di atas, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

 

3. Atribut arah

Atribut direction digunakan untuk menentukan arah pergerakan dari konten di dalam tag marquee. Dimana terdapat empat nilai pada atribut ini yaitu atas, bawah, kiri dan kanan

Secara default jika kita menggunakan nilai “left” maka teks akan berjalan dari sisi kanan ke sisi kiri dan demikian juga dengan nilai “right” maka teks akan berjalan dari sisi kiri ke sisi kanan. Kemudian untuk “up” akan berpindah dari bawah ke atas sedangkan “down” akan berpindah dari atas ke bawah. Berikut adalah contoh penulisan kode dan penggunaannya dalam HTML

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut Direction di Tag Marquee</title>
 </head>
 <body>
  <marquee direction="right">Teks ini ke kanan</marquee>
  <marquee direction="left">Teks ini ke kiri</marquee>
 </body>
</html>

Setelah Anda menjalankan kode HTML di atas, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

Di bawah ini adalah contoh lain penggunaan atribut arah (atas dan bawah)

<!DOCTYPE html>
 <html>
 <head>
  <title>Atribut Direction di Tag Marquee</title>
 </head>
 <body>
  <marquee direction="up" height="50">Teks ini bergerak dari bawah ke atas</marquee><br>
  <marquee direction="down" height="50">Teks ini bergerak dari atas ke bawah</marquee>
 </body>
 </html>

Setelah Anda menjalankan kode HTML di atas, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

4. Atribut perilaku

Atribut behavior digunakan untuk menentukan tipe pergerakan marquee. Nilai yang dapat diisi di atribut behavior yaitu slide, scroll ataupun alternate. Jika Anda tidak membuat atribut behavior di tag maka secara default nilainya adalah “scroll”.

Gulir berarti konten bergerak ke satu sisi dan muncul kembali dari sisi yang berlawanan. Kemudian, slide berarti konten bergerak ke satu sisi dan ketika mencapai sisi itu, konten berhenti (berhenti bergerak). Sementara itu, alternatif berarti konten bergerak ke satu sisi dan kemudian kembali ke sisi yang berlawanan seolah-olah dipantulkan

Berikut adalah contoh kode HTMLnya

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut Behavior di Tag Marquee</title>
 </head>
 <body>
  <marquee behavior="scroll" width="400">Welcome</marquee><br>
  <marquee behavior="slide" width="400">Welcome</marquee><br>
  <marquee behavior="alternate" width="400">Welcome</marquee><br>
 </body>
</html>
_

Setelah Anda menjalankan kode di atas, browser akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

5. Atribut scrolldelay

Atribut scrolldelay digunakan untuk menentukan waktu tunda per langkah dalam satuan milidetik (1 milidetik = 1/1000 detik) yang diisi dengan nilai numerik seperti 100. Dimana nilai defaultnya adalah 85

Berikut adalah contoh penulisan dalam HTML

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut Scrolldelay di Tag Marquee</title>
 </head>
 <body>
  <marquee width="600">Welcome</marquee><br>
  <marquee scrolldelay="100" width="600">Welcome</marquee><br>
  <marquee scrolldelay="400" width="600">Welcome</marquee>
 </body>
</html>

Setelah Anda menjalankan kode HTML di atas, browser akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

6. Atribut scrollamount

Atribut scrollamount digunakan untuk menentukan kecepatan konten di tag dalam bergerak dengan satuan pixel. Dimana nilai default-nya adalah 6. Berikut contoh penulisan kode HTMLnya :

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut Scrollamount di Tag Marquee</title>
 </head>
 <body>
  <marquee width="600">Welcome</marquee><br>
  <marquee scrollamount="15" width="600">Welcome</marquee><br>
  <marquee scrollamount="25" width="600">Welcome</marquee>
 </body>
</html>
_

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

7. Atribut bgcolor

Atribut bgcolor digunakan untuk menentukan warna latar belakang elemen marquee. Nilai atribut bgcolor dapat ditulis dengan nama warna (mis. cyan) atau dalam kode hex (#469A9A). Di bawah ini adalah contoh kode HTML

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut BGColor di Tag Marquee</title>
 </head>
 <body>
  <marquee bgcolor="cyan" width="400">Welcome</marquee>
 </body>
</html>

Tampilan di browser akan seperti ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

8. atribut HSpace

Atribut HSpace digunakan untuk menentukan ruang horizontal di kiri dan kanan tenda. Biasanya diisi dengan nilai berupa angka seperti 20, 15% atau 40px. Agar lebih jelas, lihat contoh kode HTML di bawah ini

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut HSpace di Tag Marquee</title>
 </head>
 <body>
  <marquee bgcolor="cyan" width="400">Welcome</marquee><br>
  <marquee hspace="15" bgcolor="grey" width="400">Welcome</marquee><br>
  <marquee hspace="40" bgcolor="yellow" width="400">Welcome</marquee>
 </body>
</html>
_

Ketika kode HTML di atas dijalankan, akan terlihat seperti ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

9. atribut VSpace

Atribut VSpace digunakan untuk menentukan ruang vertikal di atas dan di bawah tenda. Biasanya diisi dengan nilai berupa angka seperti 20, 15% atau 40px. Anda dapat melihat contoh penulisan atribut ini di bawah ini

<!DOCTYPE html>
<html>
 <head>
  <title>Atribut VSpace di Tag Marquee</title>
 </head>
 <body>
  <marquee bgcolor="cyan" width="400">Welcome</marquee><br>
  <marquee vspace="15" bgcolor="grey" width="400">Welcome</marquee><br>
  <marquee vspace="20" bgcolor="yellow" width="400">Welcome</marquee>
 </body>
</html>
_

Setelah Anda menjalankan kode di atas, browser akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

10. Atribut lingkaran

Atribut loop digunakan untuk menentukan berapa kali konten tenda berulang dengan nilai default tidak terbatas. Berikut adalah contoh HTMLnya

<!DOCTYPE html>
<html>
 <head>
  <title>Default Width dan Height di Tag Marquee</title>
 </head>
 <body>
  <marquee>Teks ini berjalan</marquee>
 </body>
</html>
_0

Setelah Anda menjalankannya di browser, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

11. Penggunaan tag pada gambar

Tag dapat diterapkan tidak hanya pada teks tetapi juga pada gambar. Anda cukup meletakkan source gambar di antara pasangan tag . Berikut contoh penulisan kode HTMLnya :

<!DOCTYPE html>
<html>
 <head>
  <title>Default Width dan Height di Tag Marquee</title>
 </head>
 <body>
  <marquee>Teks ini berjalan</marquee>
 </body>
</html>
_1

Setelah Anda menjalankannya di browser, maka akan muncul seperti gambar di bawah ini

Cara menggunakan cara membuat teks html
Cara menggunakan cara membuat teks html

Itulah materi cara membuat teks atau gambar berjalan di HTML menggunakan tag marquee. Misalnya jika ada pertanyaan tentang tag marquee ini, bisa ditanyakan di kolom komentar yang sudah disediakan. Kemudian ikuti materi pembelajaran HTML cara membuat tabel di HTML

Bagian 17. Cara Menambahkan Audio

Bagian 19. Cara membuat tabel

Editor. Muhammad Zakaria

Download berbagai jenis aplikasi terbaru mulai dari windows, aplikasi android, driver dan sistem operasi gratis hanya di Nesabamedia. com

Bagaimana cara membuat Paragraf dalam HTML?

Paragraf dalam HTML dibuat dengan tag .

Tulis HTML di mana?

Tempat menulis HTML ada di editor teks . Ada banyak editor teks yang dapat Anda gunakan untuk belajar HTML. Dari yang sederhana seperti Notepad++, hingga Visual Studio Code.

Apa itu pemformatan teks dalam HTML?

HTML memiliki beberapa tag yang bertujuan untuk mengubah tampilan teks atau biasa disebut dengan format teks. Berikut adalah beberapa tag pemformatan teks dalam HTML. Tag b untuk membuat huruf tebal. Tag kuat untuk mengkapitalisasi kata-kata penting.

Bagaimana cara membuat teks tebal dalam HTML?

Tag yang digunakan untuk membuat teks tebal pada HTML adalah .