Tugas pertama mata kuliah Pemrogaman Web 1 dapat tugas nich sob yaitu Membuat Biodata Diri dengan HTML. oke setelah kita tahu pada postingan sebelumnya
yaitu Dasar Pemrogaman Web (HTML) dan Juga Mengerti akan
Tag-Tag HTML kali ini kita akan mempraktekkan dari tag-tag HTML yg telah kita pelajari sebelumnya. Tugasnya disuruh Membuat Biodata Diri dengan HTML. Lah... kita kreasikan dengan tabel beserta foto profil kita za sob. biar terlihat rapi meski cuma dasar membuat tabel html yg masih statis. Kurang Lebihnya nanti yang akan kita buat Tabel biodata dengan HTML tampilanya seperti ini dr yg telah dibuat oleh penulis (maaf sengaja fotonya disensor - Takut ada yg Naksir ). he he. Just Kidding sob :-)
Tabel (table) pada HTML
Sekilas tentang tabel.Tabel (table) sangat diperlukan ketika kita ingin menampilkan data yang berbentuk kolom-kolom. Dulu sebelum adanya CSS, table digunakan untuk membuat layout website namun saat ini sudah jarang dipakai sebagai layout karena faktor file yang cenderung lebih besar sehingga mempengaruhi waktu akses yang lebih lama, dalam pengelolaan dan pengeditan pun jauh lebih rumit karena banyaknya tag-tag yang dihasilkan.
Cara membuat tabel.Untuk membuat table yang sederhana ada 3 elemen utama yaitu
table,
tr dan
td. Tag <table> adalah untuk membuat tabel kemudian di ikuti dengan tag <tr> (table rows) adalah untuk membuat baris pada tabel kemudian tag <td> (table data) adalah untuk membuat kolom pada tabel, kolom-kolom hasil dari tr dan td ini disebut dengan
table cell yaitu sebagai lokasi dimana kita memasukkan data-data yang akan di tampilkan.
Setelah kita tahu tentang Tabel (table) Pada HTML, nich sob script dr tampilan Tabel Biodata Diri saya Beserta Foto yg diatas dengan HTML:
<html>
<head>
<title>SUGENG SISWANTO</title>
</head>
<body>
<marquee>------------------------->Halaman Web Sederhana ini Merupakan <b>"Tugas 1"</b>... Mata Kuliah <b>"Pemrogaman Web"</b><----------------------------- </marquee>
<table width="520" border="1" align="center" cellpadding="1" cellspacing="1" bordercolor="#339900" bgcolor="violet">
<tr bgcolor="silver">
<th colspan="3" height="65">
<p>DATA BIODATA SAYA</p>
</th>
</tr>
<tr>
<td width="153"><b>NAMA</b></td>
<td width="23"><div align="center" >:</div></td>
<td width="326"> SUGENG SISWANTO </td>
</tr>
<tr>
<td><b>NPM</b></td>
<td><div align="center" >:</div></td>
<td> 1412110152</td>
</tr>
<tr>
<td><b>ANGKATAN</b></td>
<td><div align="center" >:</div></td>
<td> 2011/B</td>
</tr>
<tr>
<td><b>TTL</b></td>
<td><div align="center" >:</div></td>
<td> TUBAN,14-11-1993</td>
</tr>
<tr>
<td><b>ALAMAT</b></td>
<td><div align="center" >:</div></td>
<td> Ds. Pugoh Kec. Bancar</td>
</tr>
<tr>
<td height="175"><b>RIWAYAT PENDIDIKAN </b></td>
<td><div align="center" >:</div></td>
<td><p> A.PENDIDIKAN FORMAL </p>
<table width="284" align="center" bordercolor="#000000">
<tr>
<td > i . SD/MI </td>
<td >:</td>
<td > SDN 1 PUGOH </td>
</tr>
<tr>
<td > ii . SMP/MTS </td>
<td >:</td>
<td > SMPN 1 BANCAR </td>
</tr>
<tr>
<td > iii . SMA/SMK </td>
<td >:</td>
<td > SMAN 1 JATIROGO</td>
</tr>
</table>
<p > B. NON FORMAL : DEWAN AMBALAN, OSIS</p>
</td>
</tr>
<tr>
<td><b>EMAIL</b></td>
<td><div align="center" >:</div></td>
<td>sugengsiiswanto@gmail.com</td>
</tr>
<tr>
<td><b>HOMEPAGE/BLOG</b></td>
<td><div align="center" >:</div></td>
<td> http://www.sugengsiiswanto.blogspot.com</td>
</tr>
<tr>
<td><b>HOBBY</b></td>
<td><div align="center" >:</div></td>
<td> Jalan-Jalan Di Rumah Maya</td>
</tr>
<tr bgcolor="silver">
<td height="23" colspan="3"><p><hr></p>
</td>
</tr>
<tr>
<td><b>DESKRIPSI PRIBADI</b></td>
<td align="center">:</td>
<td> Simple, Nice, Kindly</td>
</tr>
<tr>
<td><b>FOTO PROFIL </b></td>
<td align="center">:</td>
<td><div align="center"><img src="sugeng siswanto.png" alt="Sugeng Siswanto" width="250" height="200"></div></td>
</tr>
</table>
</body>
</html>
selesai... |
0 komentar:
Posting Komentar