Utama.htm

Hehe..ni nyambung tulisan pertama tentang tugas UTS kemaren. Ni source code-nya
<html>
<head><title>Web site Esa PG 01108001</title></head>

<body background="images/web/Bism021-h_03.jpg">

 <table border="0">

  <tr>

<td colspan="5"><img src="images/web/Bism021-h_02.jpg">

</td>

</tr>

<tr align="center">

<td><a href="utama.htm">Home</a></td>

<td><a href="link1.htm">link1</a></td>

<td><a href="link2.htm">Link2</a></td>

<td><a href="link3.htm">Link3</a></td>

<td><a href="link4.htm">Link4</a></td>

</tr>

<tr>

<td colspan="5" align="center"><img src="images/me/esa_ori.jpg" width="30%" height="30%"><br>

Selamat datang di situs Esa Puspita Ginanjar

</td>

</tr>

<tr align="center" background="images\web\border-up_01_03.jpg">

<td><a href="utama.htm">Home</a></td>

<td><a href="link1.htm">link1</a></td>

<td><a href="link2.htm">Link2</a></td>

<td><a href="link3.htm">Link3</a></td>

<td><a href="link4.htm">Link4</a></td>

</tr>

<tr>

<td colspan="5" align="center">Copyright &copy Esa Puspita Ginanjar

</td>

</tr>

 </table>

</body>

</html>

Ya, begitulah source code utama.htm ane. Hehe. Simpel banget kan? Penjelasannya, gini.

Tag <html></html> merupakan tag pembuka dan penutup dari HTML itu sendiri.

Tag “<head><title>Web site Esa PG 01108001</title></head>” mengindikasikan judul dari site kita. Header gituh.

Tag <body background="images/web/Bism021-h_03.jpg"></body>" merupakan tag HTML tempat nantinya kita naruh semua tag HTML yang akan ditampilkan. Jadi harus ada minimah “<html><body></body></html>“. Hampir semua tag HTML harus dibuka dan ditutup, misal <html> ditutup dengan </html> dst.

Lalu kenapa ada kata-kata “background="images/web/Bism021-h_03.jpg” nya? Itu biar halaman web yang kita buat diberikan background berupa gambar, dan defaultnya gambar itu akan di-repeat alias diulang-ulang gambarnya. Bekgron bisa juga berupa warna, ganti aja tag "background="images/web/Bism021-h_03.jpg" menjadi "bgcolor="red" misalnya untuk latar berwarna merah.

Tag <table><tr><td></td></tr></table> merupakan tag untuk membuat table. Tag ini bikin tampilan situs kita lebih rapi. Lebih enak dipake daripada frame. Tag <table> harus ditutup dengan tag </table> untuk mendefinisikan table. Tag <tr> ditutup dengan </tr> untuk mendefinisikan baris dan tag <td> ditutup </td> untuk definisi kolom. Urutannya harus seperti di atas, definisi table dulu, terus definisi baris, kolom baru ditutup dengan urutan penutup tag kolom (</td>), penutup tag baris (</tr>) baru ditutup tag </table>. Oya, tag <td colspan="5"> itu untuk mendefinisikan kolom yang span alias di-merge klo di excel mah.

Tag “<a href="link1.html"></a>” berfungsi untuk membuat link. Sintaksnya harus ditulis “<a href="link1.html">tulisan yang ingin di link kan</a>“.

Segituh dulu. Bingung? Tell me where, ok!?

Oya, ni tampilan screenshoot nya. Tampilan bisa berbeda di setiap browser. Screenshoot ini diambil ketika di-preview di Firefox. Di Google Chrome agak sedikit melebar :mrgreen:

 

utama.htm

utama.htm

Iklan

5 thoughts on “Utama.htm

  1. maksudnya muncul tag tbody stlh tag table. ah, pake kurung segitiga malah jadinya ilang. ga ngerti simbol html-nya kurung segitiga, euy. hwehe…

    v(^_^)

    =====
    Oo..soal itu. Klopke tag editor spt ity, kadang emang suka muncul yg tbody.
    Sebagai contoh, klo Farijs bikin sintaks pake table di Macromedia Dreamweaver, dsana ga ada tbody..tp copy-paste ke “HTML” editor di blog, maka dengan sendirinya akan muncul tbody. Sejauh yg saya tau sih, gapapa.

    Suka

  2. welehweleh…

    keliatannya gampang2 susah. ah, jadi pgn belajar, euy.

    v(^_^)

    coba pake Kompozer kok malah muncul tag stlh tag ? ah, ga tau lah. tp untuk memudahkan mengedit htm emang lbh enak pake Kompozer.

    =====
    Kompozer? Wah, harus nyoba nih. Selama ini saya klo pke teks editor biasanya dengan notepad, notepadd++, textPad, Macromedia Dreamweaver (7,8, MX), conText, sama PHP Editor. Lebih sering pake notepad, notepad++, dan Dreamweaver 8. :mrgreen:

    Suka

Berikan Komentar

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s