Tutorial HTML: Tag Break Line, Horizontal Line dan Marquee

Tutorial Belajar HTML kali ini membahas tentang tag Break Line <br>, horizontal line <hr> dan marquee <marquee>

<BR> Break Line adalah tag HTML yang berguna untuk membuat baris baru pada dokumen  HTML. contoh penggunaan BR adalah <br> atau <br /> atau bisa juga <BR>

<HR>  Horizontal Line adalah tag HTML yang berguna untuk membuat garis horizontal pada dokumen HTML
contoh penggunaan HR adalah
<hr properti="nilai">

properti/atribut	Keterangan
Align	Properti ini berguna untuk mengatur letak dari garis horizontal. Nilai dari properti ini adalah right = untuk letak disebelah kanan center = untuk letak di tengah left = untuk letak disebelah kiri justify = untuk letak rata kanan dan kiri defaultnya adalah left Cara menggunakannya: <hr align="left">
Size	properti ini berguna untuk mengatur ukuran dari ketebalan garis horizontal. Defaultnya adalah 2 Cara menggunakannya: <hr size="1">
Width	Properti ini berfungsi untuk mengatur lebar dari garis horizontal. Satuan dari penggunaannya dengan % atau px contoh penggunaannya <hr width="200px">
Color	Properti ini berguna untuk mengatur warna dari garis horizontal. Range warna dari garis horizontal ini adalah dai #000000-#FFFFFF contoh penggunaannya <hr color="#003033">
noshade	Noshade adalah untuk menghilangkan efek shading (bayangan) pada garis horizontal. Jika anda tidak menginginkan efek bayangan hilang jangan tuliskan properti ini. Contoh penggunaan <hr noshade>

<MARQUEE> adalah sebuah teks atau kalimat yang bisa diberikan animasi bergerak.
contoh penulisan marquee
<marquee properti="nilai"></marquee>
Berikut ini adalah properti/atribut untuk tag marquee 

properti/atribut	Keterangan
Behavior	Cara tag marquee menjalankan animasi teks. Ada beberapa nilai untuk properti behaviour ini yaitu scroll = seperti menggulung layar tulisan bergerak dari arah kanan ke kiri kemudian muncul kembali dari sebelah kanan dan terus bergerak ke kiri dst slide =tulisan bergerak dari kanan ke kiri sampai ujung halaman berhenti alternate =tulisan bergerak dari kanan ke kiri setelah sampai diujung halaman bergerak dari kiri ke kanan Cara menggunakannya: <marquee behavior="slide">objek</marquee>
Direction	properti ini berguna untuk mengatur pergerakan animasi dari objek marquee Nilai dari Direction ada 4 buah 1. Left = pergerakan objek dari kanan ke kiri 2. Right = pergerakan objek dari kiri ke kanan 3. Up = pergerakan objek dari bawah ke atas 4. Down = pergerakan objek dari atas ke bawah Cara menggunakannya: <marquee direction="left">objek</marquee>
Height	Properti ini berfungsi untuk mengatur tinggi dari bidang marquee. Satuan dari penggunaannya dengan % atau px contoh penggunaannya <marquee height="10%"></marquee>
Width	Properti ini berguna untuk mengatur lebar dari bidang marquee. Satuan dari penggunaannya dengan % atau px contoh penggunaannya <marquee width="10%"></marquee>
scrolldelay	Properti ini berguna untuk mengatur delay tiap lompatan dari animasi. nilai dari scrolldelay dalam detik Contoh penggunaan <marquee scrolldelay="3"></marquee>
Bgcolor	Properti ini berguna untuk membuat warna background dari bidang marquee. nilai dari bgcolor berkisar antara #000000-#FFFFFF. atau bisa juga diisi dengan nama blue, orange, white dan lainnya dalam bahasa inggris Contoh penggunaan <marquee bgcolor="#00338811">test</marquee> atau <marquee bgcolor="blue">tes</marquee>
loop	Properti ini berguna untuk mengatur berapa kali lompatan yang akan dilakukan objek marquee. nilai defaultnya adalah INFINITE yang artinya animasi terus tanpa henti Contoh penggunaan <marquee loop="3"></marquee>
scrollamount	Properti ini berguna untuk mengatur kecepatan dari lompatan. diisi dengan nilai bilangan bulat positif Contoh penggunaan <marquee scrollamount="3"></marquee>
hspace	Properti ini berguna untuk mengatur besar space horizontal pada objek marquee. Nilai dari hspace adalah dengan angka atau persen Contoh penggunaan <marquee hspace="30%">test</marquee> atau <marquee hspace="30"></marquee>
vspace	Properti ini berguna untuk mengatur besar space vertikal pada objek marquee. Nilai dari vspace adalah dengan angka atau persen Contoh penggunaan <marquee vspace="30%">test</marquee> atau <marquee vspace="30"></marquee>

Contoh-contoh dalam textarea
1. Contoh penggunaan br
saya pergi
ke pasar


2.Contoh penggunaan hr
hr tanpa properti

---

hr dengan properti align nilai left

---

hr dengan properti align nilai right

---

hr dengan properti align nilai center

---

hr dengan properti align nilai justify

---

hr dengan size 1

---

hr dengan width = 200px

---

hr dengan width = 20%

---

hr dengan color = 003344

---

hr dengan color = blue

---

hr dengan noshade

---

2.Contoh penggunaan marquee
marquee tanpa properti
test marquee tanpa properti

marquee dengan behavior scroll
test scroll

marquee dengan behavior slide
test slide

marquee dengan behavior alternate
test alternate

marquee dengan direction up
test direction up

marquee dengan direction down
test direction down

marquee dengan direction left
test direction left

marquee dengan direction right
test direction right

marquee dengan properti width
test width 200px

marquee dengan properti width
test width 20%

marquee dengan properti height
test height 200px

marquee dengan properti height
test height 20%

marquee dengan properti scrolldelay
test scrolldelay 3

marquee dengan properti bgcolor
test bgcolor #003344

marquee dengan properti bgcolor
test bgcolor blue

marquee dengan properti loop
test loop 3

marquee dengan properti scrollamount
test scrollamount 3

hspace marquee dengan properti hspace
test hspace 200px

marquee dengan properti hspace
test hspace 20%

marquee dengan properti vspace
test vspace 200px

marquee dengan properti vspace
test vspace 20%

Cobakan Kode HTML anda di sini
1. Contoh penggunaan br <br /> saya pergi <br> ke pasar <br /> <br /><br /> 2.Contoh penggunaan hr<br /> hr tanpa properti<br /> <hr> <br /> hr dengan properti align nilai left<br /> <hr align="left"> <br /> hr dengan properti align nilai right<br /> <hr align="right"> <br /> hr dengan properti align nilai center<br /> <hr align="center"> <br /> hr dengan properti align nilai justify<br /> <hr align="justify"> <br /> hr dengan size 1<br /> <hr size="1"> <br /> hr dengan width = 200px<br /> <hr width="200px"> <br /> hr dengan width = 20%<br /> <hr width="20%"> <br /> hr dengan color = 003344<br /> <hr color="#003344"> <br /> hr dengan color = blue<br /> <hr color="blue"> <br /> hr dengan noshade <br /> <hr noshade> <br /> <br /><br /> 2.Contoh penggunaan marquee<br /> marquee tanpa properti<br /> <marquee>test marquee tanpa properti</marquee><br /> <br /> marquee dengan behavior scroll<br /> <marquee behavior="scroll">test scroll</marquee><br /> <br /> marquee dengan behavior slide<br /> <marquee behavior="slide">test slide</marquee><br /> <br /> marquee dengan behavior alternate<br /> <marquee behavior="alternate">test alternate</marquee><br /> <br /> marquee dengan direction up<br /> <marquee direction="up">test direction up</marquee><br /> <br /> marquee dengan direction down<br /> <marquee direction="down">test direction down</marquee><br /> <br /> marquee dengan direction left<br /> <marquee direction="left">test direction left</marquee><br /> <br /> marquee dengan direction right<br /> <marquee direction="right">test direction right</marquee><br /> <br /> marquee dengan properti width<br /> <marquee width="200px">test width 200px</marquee><br /> <br /> marquee dengan properti width<br /> <marquee width="20%">test width 20%</marquee><br /> <br /> marquee dengan properti height<br /> <marquee height="200px">test height 200px</marquee><br /> <br /> marquee dengan properti height<br /> <marquee height="20%">test height 20%</marquee><br /> <br /> marquee dengan properti scrolldelay<br /> <marquee scrolldelay="3">test scrolldelay 3</marquee><br /> <br /> marquee dengan properti bgcolor<br /> <marquee bgcolor="#003344">test bgcolor #003344</marquee><br /> <br /> marquee dengan properti bgcolor<br /> <marquee bgcolor="blue">test bgcolor blue</marquee><br /> <br /> marquee dengan properti loop<br /> <marquee loop="3">test loop 3</marquee><br /> <br /> marquee dengan properti scrollamount<br /> <marquee scrollamount="3">test scrollamount 3</marquee><br /> <br /> hspace marquee dengan properti hspace<br /> <marquee hspace="200px">test hspace 200px</marquee><br /> <br /> marquee dengan properti hspace<br /> <marquee hspace="20%">test hspace 20%</marquee><br /> <br /> marquee dengan properti vspace<br /> <marquee vspace="200px">test vspace 200px</marquee><br /> <br /> marquee dengan properti vspace<br /> <marquee vspace="20%">test vspace 20%</marquee><br /> <br />



Hasil program HTML

Klik tombol Coba Heading HTML untuk melihat hasilnya.

Tutorial HTML: Tag Break Line, Horizontal Line dan Marquee 2015-10-13T12:11:00+07:00 Rating: 4.5 Diposkan Oleh: Dedy Fermana