Demo Site

Sabtu, 03 April 2010

bikin tabel............

Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang

terdiri atas baris dan kolom. Untuk menampilkan data dalam bentuk table dalam

HTML, digunakan tag-tag <TABLE>, <TR>, <TD>.


<TABLE> ….. </TABLE>



Atribut :



  • align – Mendefinisikan perataan (align) tabel yaitu yaitu perataan kiri (left), tengah (center) atau kanan (right).

  • bgcolor – Mendefinisikan warna latar belakang

  • border – Mendefinisikan ukuran garis tepi (border) dalam satuan pixels.

  • cellpadding – Mendefinisikan spasi


  • cellspacing – Mendefinisikan spasi antara dua cells dalam satuan pixels.

  • width – Mendefinisikan ukuran tabel dalam pixels atau persentase.


contoh :


<TABLE align=”center” bgcolor=”blue” border=”2″ cellpadding=”5″ cellspacing=”2″ width=”90%”>



<TR> ….. </TR>, untuk menentukan baris (table row)


Atribut :



  • align – Mendefinisikan perataan (align) tabel yaitu yaitu perataan kiri

    (left), tengah (center) atau kanan (right)

  • bgcolor – Mendefinisikan warna latar belakang pada baris (rows)


  • valign – Mendefinisikan perataan vertikal pada isi dari rows, yaitu

    perataan top, middle atau bottom.


Contoh :


<TR align=”right” bgcolor=”red” valign=top>



<TD> …… </TD>, untuk menampilkan data pada setiap sel tabel (table

data)

..

Atribut :



  • align – Mendefinisikan perataan (align) tabel yaitu yaitu perataan kiri (left), tengah (center) atau kanan (right).


  • background – Meletakkan image pada latar belakang tabel.

  • bgcolor – Mendefinisikan warna latar belakang

  • colspan -

  • height – Mendefinisikan tinggi cells dalam pixels

  • nowrap -

  • rowspan -


  • valign – Perataan vertikal yaitu perataan pada top, middle atau bottom.

  • width – Mendefinisikan ukuran tabel dalam pixels atau persentase.


Contoh :


<TD align=”right” background=”back.gif” bgcolor=”green” colspan=”3″


height=”200″ nowrap rowspan=”2″ valign=”bottom” width=”300″>


Struktur tag ini adalah sebagai berikut :


<TABLE>

<TR>


<TD> data baris 1 kolom 1 </TD>

<TD> data baris 1 kolom 2 </TD>

</TR>

<TR>

<TD> data baris 2 kolom 1 </TD>


<TD> data baris 2 kolom 2 </TD>

</TR>

</TABLE>














data baris 1 kolom 1data baris 1 kolom 2
data baris 2 kolom 1data baris 2 kolom 2

marquee

Apa itu marquee ? Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Program marquee ini banyak diminati dan di pakai oleh para blogger di dalam blognya karena sifat program ini yang dinamis serta menarik untuk di lihat disamping untuk menghemat tempat pada halaman blog.





Marquee ini bisa di buat dengan menggunakan tag <marquee>...</marquee>.




Atribut yang sering di gunakan adalah :




BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks



DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks



BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan



Scroll --> teks bergerak berputar

Slide--> teks bergerak sekali lalu berhenti

Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)



TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks



SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.



SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik




LOOP="angka|-1|infinite" --> Mengatur jumlah loop



WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen




Agar lebih jelas akan saya sertakan contohnya :



Contoh marquee dari gerakan :



<MARQUEE align="center" direction="right"
height="200" scrollamount="2" width="30%">




marquee dari kanan ke kiri



</MARQUEE>




hasilnya :





marquee dari kanan ke kiri




ganti kata "left" dengan keinginan anda yaitu bisa : left, up, down .






Contoh marquee dari perilaku gerakan :



<MARQUEE align="center"
direction="left" height="200" scrollamount="3"
width="70%" behavior="alternate">





marquee menurut perilaku




</MARQUEE>







marquee menurut perilaku







Contoh marquee dengan variasi hurup dan warna latar belakang :





<div align="left">&ltFONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="RED" width="70%" scrollamount="3" behavior="alternate">



</MARQUEE></b></FONT></div>




hasilnya :





marquee dengan variasi hurup






Ada variasi lain dari marquee ini, yakni ketika mouse sedang berada di area marquee teks akan berhenti dan ketika mouse di geser kembali ketempat lain maka teks akan bergerak kembali, ini hanya di tambahkan sedikit program pada kolom marquee.



Contoh, silahkan arahkan mouse anda ke area marquee di bawah ini :



<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center">



silahkan tunjuk ke sini



</marquee>






hasilnya :






silahkan tunjuk ke sini







Contoh marquee yang di dalam nya terdapat link :



<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">





<a href="" target="new">Rubrik Elektronik</a><br/>




<a href="" target="new">Electronic Rubric </a><br/>





<a href="" target="new">Kolom iklan </a><br/>








</marquee>







hasilnya :




Free Template





Kolom iklan













Mungkin itu saja beberapa contoh yang bisa di berikan, silahkan anda otak-atik sendiri agar tercipta variasi-variasi dari marquee ini.




Selamat ber eksperimen