Cara membuat Form dan Table dengan HTML

Selamat pagi sahabat blogger, :) Semangat hari ini masih bisa beraktivitas. Hari ini Saya akan berikan sedikit pemahaman kode pada HTML5 untuk membuat Form dan Tabel. Silahkan di cek:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title> Latihan 1 - Sokhi Registration</title>
  
    <style type="text/css">
    form {
    -moz-box-shadow: 0px 0px 8px #dcdcddc;
    -webkit-box-shadow: 0px 0px 8px #dcdcddc;
    box-shadow: 0px 0px 8px #dcdcddc;
    border: 1px gray solid;
    padding: 5px;
    display: block;
    }
    h9 {
    font-size: 20pt;
    color: green;
    margin: 0px;
    border-bottom: 2px gray solid;
    padding: 5px;
    margin-bottom: 5px;
    display: block;
    }
</style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5" bgcolor="yellow">
<tr><td colspan="2"><h4><center>Tambah Pejabat</center></h4></td></tr>
<tr><td>
<table border="1" cellspacing="0" cellpadding="5">
        <tr bgcolor="gray solid"><th>No</th><th>Tahun</th><th>Nama Periode</th></tr>
        <tr><td>1</td><td>2013</td><td>Periode Hamim 2</td></tr>
        <tr><td>2</td><td>2014</td><td>Hamim 3</td></tr>
        <tr><td>3</td><td>2014</td><td>Hamim 3</td></tr>
    </table>
    </td><td>
    <table>
        <form action="#" method="post">
        <tr><td>Periode Jabatan</td>
        <td><select name="periode jabatan">
            <option value="0">-Pilih Periode-</option>
            <option value="2014">2014</option>
            <option value="2013">2013</option>
            <option value="2012">2012</option>
            <option value="2011">2011</option>
        </select></td></tr>
        <tr><td>Jabatan</td>
        <td><select name="jabatan">
            <option value="0">-Pilih Jabatan-</option>
            <option value="Directure">Directure</option>
            <option value="Manager">Manager</option>
            <option value="Staff">Staff</option>
            <option value="Office Boy">Office Boy</option>
        </select></td></tr>
        <tr><td>Nama Pejabat</td>
        <td><input type="text" name="nama pejabat" /></td><br/>
        <tr><td>Unit Kerja</td>
        <td><select name="unit kerja">
            <option value="0">-Pilih Fakultas-</option>
            <option value="Teknik">Teknik</option>
            <option value="Hukum">Hukum</option>
            <option value="Ekonomi">Ekonomi</option>
            <option value="FKIP">FKIP</option>
        </select></td></tr>
        <tr><td>Unit Kerja</td>
        <td><select name="unit prodi">
            <option value="0">-Pilih Prodi-</option>
            <option value="Informatika">Informatika</option>
            <option value="Perminyakan">Perminyakan</option>
        </select></td></tr>
        <tr><td>
        </td>
        <td><input type="submit" value="Simpan" name="Submit" />
            <input type="reset" value="Reset" name="Reset" />
            <input type="button" value="Kembali" name="button" />
        </td></tr>
    </table>
</table>
</form>
</body>
</html>


demikianlah kode pada HTML5 silahkan di coba dan semoga berhasil
*Notepad++

0 comments:

Thanks for commented