Tugas WEB PROGRAMING


baik.. ini pertama kalinya saya posting tugas di blog ini, dan ini juga sebagai penambahan kategori baru dalam sitemap blog ini yaitu
kategori "Tugas", nah, mungkin ada pembaca yang bertanya kenapa harus posting tugas diblog wischain? ya karena sekalian buattambah-tambah postingan
sekaligus memperlihatkan struktur template blog wischain bagian index
OK, berikut tugas yang sudah saya buat tentang struktur template blog wischain ini dengan tag tabel..

Nama: WISNU PRIAMBODO
NIM: 10.01.53.0040
Matakuliah: WEB PROGRAMMING
Dosen : JEFFRI ALFA RAZAQ,M.KOM


Coding dan Penjelasan:

<table width="400" height="480" border="1"> //Tag Tabel dengan lebar 400px dan tinggi 480px serta tebal border 1
<tr>
<td height="25" colspan="3" align="center" valign="middle" bgcolor="#FF0000"><font color="#FFFFFF">Navigasi Menu 1</font></td> //Tag td dengan tinggi 25px, mengisi 3 kolom pada suatu table, perataan horizontal ditengah dan perataan vertikal juga ditengah, background warna merah, dan tag font dg font berwarna putih.
</tr>
<tr>
<td colspan="3" align="center" valign="middle">Header</td> //Tag td dengan mengisi 3 kolom pada suatu table, garis lurus ditengah dan garis lurus vertikal juga ditengah.
</tr>
<tr>
<td height="25" colspan="3" align="center" valign="middle" bgcolor="#FF0000"><font color="#FFFFFF">Navigasi Menu 2</font></td> //Tag td dengan tinggi 25px, mengisi 3 kolom pada suatu table, perataan horizontal ditengah dan perataan vertikal juga ditengah, background warna merah, dan tag font dg font berwarna putih.
</tr>
<tr>
<td width="33%" height="28" align="center" bgcolor="#CC3300"><font color="#FFFF00">Judul Konten</font></td> //Tag td dengan tinggi 28px lebar 33%, perataan horizontal ditengah, background warna merah, dan tag font dg font berwarna kuning.
<td width="33%" rowspan="2" align="center" bgcolor="#00FF00">Blogroll</td>//Tag td dengan lebar 33%, mengisi 2 baris pada suatu table, perataan horizontal ditengah, background warna hijau
<td width="33%" rowspan="2" align="center bgcolor="#00FF00"">Menu</td>//Tag td dengan lebar 33%, mengisi 2 baris pada suatu table, perataan horizontal ditengah, background warna hijau
</tr>
<tr>
<td height="33%" align="center">Isi Konten</td>//Tag td dengan lebar 33%, perataan ditengah.
</tr>
<tr>
<td height="150" align="center" bgcolor="#00FF00">Widget 1</td> //Tag td dengan tinggi 150px, perataan horizontal ditengah, background warna hijau
<td height="150" align="center" bgcolor="#00FF00"> Widget 2</td> //Tag td dengan tinggi 150px, perataan horizontal ditengah, background warna hijau
<td height="150" align="center" bgcolor="#00FF00"> Widget 3</td> //Tag td dengan tinggi 150px, perataan horizontal ditengah, background warna hijau
</tr>
<tr>
<td height="25" colspan="3" align="center" bgcolor="#FF0000">footer</td>//Tag td dengan tinggi 25px, mengisi 3 kolom pada suatu table, perataan horizontal ditengah, background warna merah.
</tr>
</table>


Code Asli, Buka Spoiler :
<table width="400" height="480" border="1">
<tr>
<td height="25" colspan="3" align="center" valign="middle" bgcolor="#FF0000"><font color="#FFFFFF">Navigasi Menu 1</font></td>
</tr>
<tr>
<td colspan="3" align="center" valign="middle">Header</td>
</tr>
<tr>
<td height="25" colspan="3" align="center" valign="middle" bgcolor="#FF0000"><font color="#FFFFFF">Navigasi Menu 2</font></td>
</tr>
<tr>
<td width="33%" height="28" align="center" bgcolor="#CC3300"><font color="#FFFF00">Judul Konten</font></td>
<td width="33%" rowspan="2" align="center" bgcolor="#00FF00">Blogroll</td>
<td width="33%" rowspan="2" align="center" bgcolor="#00FF00">Menu</td>
</tr>
<tr>
<td height="33%" align="center">Isi Konten</td>
</tr>
<tr>
<td height="150" align="center" bgcolor="#00FF00">Widget 1</td>
<td height="150" align="center" bgcolor="#00FF00"> Widget 2</td>
<td height="150" align="center" bgcolor="#00FF00"> Widget 3</td>
</tr>
<tr>
<td height="25" colspan="3" align="center" bgcolor="#FF0000">footer</td>
</tr>
</table>



====================

Hasil Screenshot:




Hasil *(Hasil dibawah tidak sama dengan screenshot diatas karena sebelumnya saya telah memodifikasi css tabelnya) :

Navigasi Menu 1
Header
Navigasi Menu 2
Judul Konten Blogroll Menu
Isi Konten
Widget 1 Widget 2 Widget 3
footer




0 Komentar untuk "Tugas WEB PROGRAMING"

 
Copyright © 2014 Template Edit - All Rights Reserved
Template By. Catatan Info