Rabu, 31 Oktober 2012

tag-tag pada bahasa HTML

tag-tag sederhana :

1. <marquee> … </marquee> = tulisan berjalan atau bergerak pada halaman web anda
contoh atribut dalam marquee :
     a. seperti yang kemarin kita buat, yaitu berjalan dari sebelah kanan ke kiri

Selamat datang ..

Kode yang dipakai:

<marquee direction="left"> Selamat datang .. </marquee>

     b. dari kiri ke kanan

Selamat datang ..

Itu menggunakan kode sbb.

<marquee direction="right"> Selamat datang .. </marquee>

     c. bolak balik dari kanan ke kiri kembali kiri ke kanan

Selamat datang ..

Kode yang dipakai:

<marquee behavior="alternate"> Selamat datang .. </marquee>

     d. dari bawah ke atas

selamat datang ..

Kode yang digunakan

<marquee direction="up"> selamat datang .. </marquee>

     e. Dari atas ke bawah

Selamat datang ..

Kode yang dipakai

<marquee direction="down"> Selamat datang .. </marquee>

     f. dari atas bawah kembali dari bawah ke atas

Selamat datang ..

Kode yang digunakan

<marquee behavior="alternate" direction="up">Selamat datang..</marquee>
     g. menyudut dari atas ke bawah

Selamat datang ..
Anda bisa menggunakan kode berikut ini

<marquee><marquee direction="down">Selamat datang .. </marquee></marquee>

     h. menyudut dari bawah ke atas

Selamat datang..
Kode yang di pakai

<marquee><marquee direction="up"> Selamat datang.. </marquee></marquee>

     i. serong ke atas dan kembali

selamat datang ..

Kode yang digunakan

<marquee direction="up"><marquee behavior="alternate">selamat datang .. </marquee></marquee>

     j. menyudut dari bawah ke atas kembali menyudut dari atas ke bawah

selamat datang..

Kode yang dipakai

<marquee behavior="alternate" direction="down"><marquee behavior="alternate">selamat datang.. </marquee></marquee>

     k. jala sambil kedip kedip
  
selamat datang..

Kode yang dipakai

<marquee direction="left"><blink> selamat datang </blink></marquee>
     l. Dengan background warna

Selamat Datang..

Kode yang dipakai:

<marquee bgcolor=" COLOR " style="color: COLOR "> Selamat Datang.. </marquee>

     m. Jalan berlawanan

Selamat Datang..Selamat Datang..

Kode yang digunakan

<marquee> Selamat Datang.. </marquee> <marquee direction="right"> Selamat Datang.. </marquee>

      n. Text banyak

Hallo
selamat datang
apa kabar
salam sejahtera


Kode yang digunakan:

<marquee direction="right"> Hallo <br> selamat datang <br> apa kabar <br> salam sejahtera </marquee>

2. <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

3.<head>….</head> & <title> ….</title>= pada bagian ini adalah judul dari web/html anda
contoh :
<head>
<title> home page saya </title>
</head>

4. <body> = berfungsi sebagai isi untuk menuliskan script – script yang mana nantinya sebagai halaman 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

5. <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

6. <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

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

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 judul suatu 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 :

 
tag - tag combinasi :

1. Teks berwarna  berjalan dg background, jenis tulisan, tebal, miring, dan garis bawah
<marquee bgcolor=" COLOR " style="color: COLOR "><font size =”4″ color=”blue” face=”arial”><b><i><u><blink>  Selamat Datang </blink></u></i></b></font></marquee>
 2. Membuat table dengan simbol/bullet
 <li><table border=”1″  valign=”top” align=”center”  width=”250″  height=”400″ bgcolor=”blue”> … </table></li> 

0 komentar:

Posting Komentar