kegunaan tag

5/17/2018 Kegunaan Tag - slidepdf.com

http://slidepdf.com/reader/full/kegunaan-tag 1/7

adakah diantara kalian sudah mengetahui tentang tag dan atribut dalam HTML ??? sebagian

besar pasti sudah tetapi sekedar untuk mengingat dam memberi info dalam HTML terdapat

beberapa tag dan atribut yang masing – masing mempunyai fungsi yang penting dalam web

dalam HTML .

HTML (Hypertext Markup Language) merupakan bahasa pemrograman web yang digunakanuntuk membuat halaman situs.Dalam belajr HTML anda bisa belajar membuatnya di

dreamweaver atau di notepad

Nah jika ada yang belum tau anda bisa membacanya di bawah ini ,saya akan menjelaskan

dari dasarnya !!!!!

1. <html>= pertama kali anda menuliskan script pada dreamweaver atau notepad anda

menuliskan <html> itu wajib karna sebagai pembuka dalam menulis script – script yang lain.

ingat : setiap tag harus di tutup dengan slais “/” ex:<html> …. </html> ; <head> …

</head>;dll

2.<head>….</head> & <title> ….</title>= pada bagian ini adalah judul dari web/html anda

contoh :

<head>

<title> home page saya </title>

</head>

3. <body> = berfungsi sebagai isi untuk menuliskan script – script yang mana nantinya sebagaihalaman web anda

dalam tag body bisa kita sisipkan atribut background yang berguna sebagai background

halaman web,contoh :

• <body bgcolor=”red”> atau <body bgcolor=”#FF0000”> = memberi warna pada

halaman web anda

• <body background=”Gambar.jpg”> = memberi background gambar pada halaman web

anda,jika anda ingin gambar anda terlihat dan tidak terjadi kesalahan buatlah semua

pekerjaan anda dalam 1 folder

4. <a> … </a> = Membuat hyperlink/link

contoh :

• <a href=”google.com”> Home </a> = jika anda klik home anda akan menuju halaman

google

• <a href=”latihanlain.html”> Home </a> = jika anda klik anda akan menuju halaman

pada latihanlain.html

5. <img> = memasukan gambar pada halaman web anda

contoh :



• <img src=”dian.jpg”> = perhatikan extensi pada image nya jika berextensi .gif jadi

dian.gif tetapi jika jpeg jadi dian.jpg

• <img src=”dian.jpg” width=”50″ height=”50″ > = untuk width dan height ini untuk

mengatur ukuran gambar

6. <font> … </font> = membuat tulisan pada halaman web

contoh atributnya :

<font size =”4″ color=”blue” face=”arial”> dianluffi.wordpress.com </font>

• atribut size = ukuran tulisan

• atribut color = warna pada tulisan

• atribut face = jenis untuk tulisannya

• lalu tutup dengan “</font>”

Atribut untuk font color

•

7. <marquee> … </marquee> = tulisan berjalan atau bergerak pada halaman web anda

contoh atribut dalam marquee :

DIRECTION = Atribut ini digunakan untuk menentukan arah gerak dari tampilan apakah ingin

ke kiri, kanan, atas, atau bawah

• <marquee direction=”right”> dianluffi.wordpress.com </marquee> = tulisan berjalandari kiri ke kanan

• <marquee direction=”left”> dianluffi.wordpress.com </marquee> = tulisan berjalan dari

kanan ke kiri

• <marquee direction=”up”> dianluffi.wordpress.com </marquee> = tulisan berjalan ke

atas

• <marquee direction=”down”> dianluffi.wordpress.com </marquee> = tulisan berjalan

ke bawah

BEHAVIOR = Atribut ini digunakan untuk menentukan bagaimana tampilan bergerak, jika

sebelumnya yang ditentukan adalah arahnya maka pada atribut BEHAVIOUR yang ditentukan

adalah perilaku geraknya

http://dianluffi.files.wordpress.com/2011/04/43.jpg



• <marquee behaviour=”scroll”> dianluffi.wordpress.com </marquee> = tulisan dengan

penentuan BEHAVIOR = SCROLL maka tampilan akan bergerak sesuai arah yang

ditentukan dan akan kembali mengulangi gerakan dari titik awal gerakan

• <marquee behaviour=”slide”> dianluffi.wordpress.com </marquee> = tulisan dengan

penentuan BEHAVIOR = SLIDE maka tampilan akan bergerak sesuai arah yang

ditentukan lalu kemudian berhenti di titik akhir tanpa mengulangi gerakan sebelumnya

• <marquee behaviour=”alternate”> dianluffi.wordpress.com </marquee> = tulisan

dengan penentuan BEHAVIOR = ALTERNATE maka tampilan akan bergerak bolak-

balik

SCROLL DELAY = Atribut ini digunakan untuk menentukan jeda waktu antara tiap gerakan

dari tampilan.,nilai yang di isi untuk atribut ini adalah berupa angka dalam mili detik

• <marquee scrolldelay=”500″> dianluffi.wordpress.com </marquee> = Delay 500 mili

detik

• <marquee scrolldelay=”1000″> dianluffi.wordpress.com </marquee> = Delay 1000

mili detik

BGCOLOR = Atribut BGCOLOR pada tag MARQUEE akan menghasilkan jalur gerakan

memiliki warna,prinsip kerja atribut ini sama dengan atribut BGCOLOR pada tag TABLE

yaitu memberikan warna latar

• <marquee bgcolor=”blue”> dianluffi.wordpress.com </marquee> = tag ini bergerak

dengan memberikan warna pada dianluffi.wordpress.com

HSPACE = Atribut ini berguna untuk memberikan jarak antara tampilan bergerak dengantulisan yang ada disamping kanan dan kiri tulisan

• Selamat datang <marquee width=”20%” bgcolor=”blue”> dianluffi.wordpress.com

<br> one piece </marquee> thank you

VSPACE = Atribut ini berguna untuk memberikan jarak antara tampilan bergerak dengan

tulisan yang ada diatas dan dibawah tulisan

• Selamat datang <br> <marquee width=”20%” bgcolor=”blue”>

dianluffi.wordpress.com <br> one piece </marquee><br> thank you

8. <big> … </big> = membuat tulisan menjadi besar

9. <small> … </small> = membuat tulisan menjadi kecil

10. <b> … </b> = membuat tulisan bercetak tebal / bold

11. <i> … </i> = membuat tulisan bercetak miring / italic

12. <u> … </u> =membuat tulisan bergaris bawah / underlined

13.<hn>Judul paragraf</hn> ——>n = 1,2,3,4,5,6 (tingkat judul) = Untuk menuliskan judulsuatu paragraf atau lebih dikenal sebagai heading



contoh :

<h1>dianluffi.wordpress.com</h1>

14. <p> … </p> = membuat paragraf

contoh :

15. <br> = tag untuk mengganti baris ,tag ini tidak perlu di tutup

contoh :

16. <tr> … </tr> = tag untuk membuat baris pada table

17. <td> … </td> = tag untuk membuat kolom/cell pada table






contoh penggunaan td dan tr :

18.<table> … </table> = untuk mebuat table

Pada tag table terdapat beberapa atribut yaitu :

<table border=”1”> … </table> = merupakan perintah utama dalam pembuatan tabel,pada

script ini yang dimaksud dengan border itu adalah ketebalan untuk table nya yaitu table dengan

ketebalan 1px,jika anda ganti 1 itu dengan 2 maka garis bordernya juga semakin tebal

<table border=”1″ valign=”top” align=”center” width=”250″ height=”400″ bgcolor=”blue”>

… </table>

• align=”…” untuk mengatur tabel rata tengah, kanan, atau kiri

• width=”…” untuk mengatur lebar tabel,bisa di isi dengan satuan pixel atau persen.

Contoh:<table width=”80%”> atau <table width=”600”>

• height=”…” untuk mengatur tinggi table

• valign=”…” untuk mengatur perataan secara vertikal dari suatu cell.Seperti top, middle,

dan bottom

• bgcolor=”…” untuk mengatur warna background tabel,baris, atau cell

contoh :




19. <li> … </li> = Untuk menandai suatu item dari daftar (enumerasi), diawali dengan simbol

” • ” (bullet) Kelompok item harus diapit oleh tag <ul> … </ul> dalam daftar bertingkat.

Untuk menomori enumerasi dengan nomor urut (1,2,3), apitlah dengan tag <ol>… </ol>

contoh :

• <sup> …. </sup> & <sub> … </sub> = Untuk menandai bagian karakter agar dicetak

tinggi atau rendah, biasanya untuk rumus matematika atau kimia.

contoh :





sekian dari saya dan terima kasih atas kunjungannya .

http://dianluffi.files.wordpress.com/2011/04/dian1.jpg

kegunaan tag

Documents