Kamis, 28 Januari 2016

TUGAS PEMOGRAMAN WEB

LAYOUT HALAMAN WEB TUGAS 6

Nah,yang ini hampir sama saja tapi ada sedikit beda..

Codingnya :


 <!DOCTYPE html>
<head>
<title>Top index</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table width="800" height="542" border="1" align="center">
<tr>
<td height="23" align="center" bordercolor="#FFFFFF" bgcolor="#FFFF00"><strong><font size="+5">Banner / Judul</font></strong></td>
</tr>
<tr>
<td height="457" align="center" bgcolor="#C0C0C0">
<p>Body atau contents(isi)</p>
<p><font color="#006600">Body atau contents(isi)</font></p>
<p><font color="#CC0000">Body atau contents(isi)</font></p>
<p><font color="#FFFF00">Body atau contents(isi)</font></p>
<p><font color="#800080">Body atau contents(isi)</font></p></td>
</tr>
<tr>
<td height="23" align="center" bgcolor="#CCFF99"><font color="#FF0000"><font size="+1"><b>Daftar isi atau navigasi</b></font></td>
</tr>
</table>
</form>
</body>
</html>


                                                  Hasil dari coding :

         









LAYOUT HALAMAN WEB TUGAS 5

HOLLA,Saya kembali lagi untuk menulis sebuah halaman web blog saya,tapi kali ini saya akan menjelaskan sebuah coding yang di beri tugas oleh guru pembimbing saya,Mari di simak....

Codingnya :

<!DOCTYPE html>
<head>
<title>Top index</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table width="800" height="542" border="1" align="center">
<tr>
<td height="23" align="center" bordercolor="#FFFFFF" bgcolor="#FFFF00"><strong><font size="+5">Banner
atau iklan</font></strong></td>
</tr>
<tr>
<td height="27" align="center" bgcolor="#FFCCCC"><font color="#FF0000">Daftar
isi atau navigasi </font></td>
</tr>
<tr>
<td height="457" align="center" bgcolor="#FF66CC">
<p>Body atau contents(isi)</p>
<p><font color="#006600">Body atau contents(isi)</font></p>
<p><font color="#CC0000">Body atau contents(isi)</font></p>
<p><font color="#FFFF00">Body atau contents(isi)</font></p>
<p><font color="#FF6633">Body atau contents(isi)</font></p></td>
</tr>
<tr>
<td height="23" align="center" bgcolor="#CCFF99"><font color="#9966CC">Info
tambahan atau lain-lain </font></td>
</tr>
</table>
</form>
</body>
</html>

                                                Hasil dari coding :


Rabu, 27 Januari 2016

TABEL IN TABLE

    
ASSALAMMUALAIKUM WR.WB

Selamat datang kembali di blog saya,disini saya akan menjelaskan tentang tabel lagi tapi yang ini berbeda daripada sebelumnya dan ini bisa di gunakan dalam Notepad atau Notepad++,tidak usah basa basi lagi mari dilihat....

<head>
    <title>Table In Table</title>
</head>

<body>
    <table cellpadding="5" align="center" bgcolor="red" width="800px" cellspacing="5">
        <tr><td><b><center>Banjarmasin</center>
            <table width="100%" cellspacing="5" cellpadding="5"><tr><td  valign="top" bgcolor="white" height="50px"><b><center>KALIMANTAN SELATAN</center></td></tr></table>
            <table width="100%"  cellspacing="5" cellpadding="5"><tr><td  valign="top" bgcolor="white" height="80px"><b><center>SOUTH BORNEO</center></td></tr></table>
            <table width="100%" cellspacing="5" cellpadding="5"><tr><td  valign="top" bgcolor="white" height="100px"><b><center>INDONESIA</center></td></tr></table>
            <table width="100%" cellspacing="5" cellpadding="5"><tr><td  valign="top" bgcolor="white" height="250px"><b>BANJARMASIN
                <table width="100%" cellspacing="5" cellpadding="5">
                    <tr>
                    <td valign="top" bgcolor="#00BCD4" width="150px" height="250px"><center>BANJARMASIN</center></td>
                    <td valign="top" bgcolor="#00BCD4"><center>BANJARMASIN</center>
                        <table cellpadding="7" cellspacing="5" bgcolor="#yellow" width="100%">
                            <tr><td><b>KABUPATEN</td></tr>
                            <tr><td bgcolor="white" valign="top" height="50px">MARTAPURA</td></tr>
                            <tr><td bgcolor="white" valign="top">BINUANG</td></tr>
                            <tr><td bgcolor="white" valign="top" height="50px">RANTAU</td></tr>
                            <tr><td bgcolor="white" valign="top">HULU SUNGAI TIMUR</td></tr>
                            <tr><td bgcolor="white" valign="top" height="40px">HULU SUNGAI SELATAN</td></tr>
                            <tr><td bgcolor="white" valign="top">HULU SUNGAI UTARA</td></tr>
                            <tr><td bgcolor="white" valign="top" height="120px">BALANGAN</td></tr>
                        </table>
                    </td>
                    <td valign="top" bgcolor="#00BCD4" width="150px"><center>BANJARMASIN</center></td>
                    </tr>
                </table>
            </td></tr></table>
            <table width="100%" cellspacing="5" cellpadding="5"><tr><td  valign="top" bgcolor="00BCD4" height="30px"><b><colspan>DHARMA YUSREZA</colspan></td></tr></table>      
        </td></tr>
    </table>
</body>
</html>








                                            Gambar html dalam Notepad++,


         


                                              Gambar hasil dari Coding,






Terima kasih sudah mampir di blog saya,sekian dari saya WASSALAMMUALAIKUM WR.WB

Sabtu, 09 Januari 2016

Tutorial Cara Pembuatan Tabel Bersarang

Pertama saya ucapkan selamat datang di blog saya,mungkin kalian sudah tau apa itu tabel bersarang?nah di sini saya akan menjelaskan sedikit tentang "Apa itu tabel bersarang",ya langsung saja tabel bersarang adalah tabel dalam website yang banyak digunakan untuk menyajikan informasi yang terdiri dari baris dan kolom agar tampak lebih rapi dan mudah dipahami yang melalui Notepad ataupun Notepad++.


Berikut adalah contoh kode membuat table sederhana dalam html :

<html>
<head>
</head>
<body>
    <table border="1" cellpadding="5">
    <caption>Online Order</caption>
    <tr>
        <th>Description</th>
        <th>Qty</th>
        <th>Price</th>
        <th>Email Account Note</th>
    </tr>
   
   
    <tr>
        <td>Email Account</td>
        <td>10</td>
        <td>$9.90</td>
        <td rowspan="5">
            <table border="1">
                <tr><td>Mailbox</td><td>10GB</td></tr>
                <tr><td>Webmail</td><td>Yes</td></tr>
                <tr><td>POP3</td><td>Yes</td></tr>
                <tr><td>IMAP</td><td>Yes</td></tr>
                <tr><td>Anti-spam</td><td>Yes</td></tr>
            </table>
        </td>
    </tr>
   
    <tr>
        <td>FYIcenter.com ad</td>
        <td align="right">1</td>
        <td align="right">$99.00</td>
    </tr>
   
    <tr>
        <td>1-years Acces</td>
        <td align="right">1</td>
        <td align="right">$199.00</td>
    </tr>
   
    <tr>
        <td colspan="2">Shipping</td>
        <td>$3.99</td>
    </tr>
   
    <tr>
        <td colspan="2">Tax</td>
        <td>$15.99</td>
    </tr>
    </table>
</body>
</html>


Contoh gambar dalam pembuatan code di dalam Notepad++ :

      Gambar 1.
    





     Gambar 2.                                                                        




      Gambar Hasil dari coding di atas.