Rabu, 09 Januari 2019

Pemrograman HTML


<!DOCTYPE html>
<html>
<body>

<table rules="rows" style="center;color:black">
<tr>
  <td>KEANGGOTAAN</td>
  <br>
</tr>

<tr>
  <td>Pencarian Anggota:
  <input type="search" name="Pencarian Anggota">
  <input type="submit" value="PENCARIAN"></td>
  <td><input type="submit" value="DAFTAR ANGGOTA"></td>
  <td><input type="submit" value="LIHAT ANGGOTA YANG KEDALUWARSA"></td>
  <td><input type="submit" value="TAMBAH ANGGOTA"></td>
</tr> 
</table>

<table rules="rows" style="center;color:black">
<tr>
  <td><input type="submit" value="SIMPAN"></td>
</tr>

<tr>
  <td>ID Anggota*</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Nama Anggota*</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Tanggal Lahir</td>
  <td>:</td>
  <td><input type="date"></td>
</tr>
<tr>
  <td>Anggota Sejak*</td>
  <td>:</td>
  <td><input type="date"></td>
</tr>

<tr>
  <td>Tanggal Registrasi</td>
  <td>:</td>
  <td><input type="date"></td>
</tr>

<tr>
  <td>Berlaku Hingga*</td>
  <td>:</td>
  <td><input type="checkbox" name="Set Otomatis" value="Set Otomatis">Set Otomatis<br>
  <input type="date"></td>
</tr>

<tr>
  <td>Institusi</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Tipe Keanggotaan</td>
  <td>:</td>
  <td><select name="Tipe Keanggotaan">
            <option
            value="Mahasiswa">Mahasiswa</option>
            <option
            value="Dosen">Dosen</option>
            <option
            value="Alumni">Alumni</option>
            </select></td>
</tr>

<tr>
  <td>Jenis Kelamin</td>
  <td>:</td>
  <td><input type="radio" name="gender" value="laki-laki" checked> laki-laki
  <br>
  <input type="radio" name="gender" value="perempuan"> perempuan</td>
</tr>

<tr>
  <td>Alamat</td>
  <td>:</td>
  <td><textarea name="message" rows="3" cols="22"></textarea></td>
</tr>

<tr>
  <td>Kode Pos</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Alamat Surat</td>
  <td>:</td>
  <td><textarea name="message" rows="3" cols="22"></textarea></td>
</tr>

<tr>
  <td>Nomor Telepon</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Nomor Faks</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Nomor Identitas</td>
  <td>:</td>
  <td><input type="text"></td>
</tr>

<tr>
  <td>Catatan</td>
  <td>:</td>
  <td><textarea name="message" rows="3" cols="22"></textarea></td>
</tr>

<tr>
  <td>Tunda Keanggotaan</td>
  <td>:</td>
  <td><input type="checkbox" name="Ya" value="Ya">Ya</td>
</tr>

<tr>
  <td>Foto</td>
  <td>:</td>
  <td><input type="file" name="myFile"></td>
</tr>
</table><br>

<style>
table {
            width: 100%;
}
table, th, td {
            rules: rows ;
           
}
th, td {
            padding: 5px;
            text-align: left;
}
table.names tr:nth-child(even) {
            background-color: #eee;
}
table.names tr:nth-child(odd) {
            background-color: #eee;
}
table.names th {
            background-color: black;
            color: white;
}
</style>

<table class="names">
  <tr>
            <th>ID ANGGOTA*</th>
            <th>NAMA ANGGOTA</th>
            <th>TIPE KEANGGOTAAN</th>
            <th>SUREL</th>
            <th>TERAKHIR DIUBAH</th>
  </tr>
  <tr>
            <td>1204411665</td>
            <td>A AGUNG NASARUDDIN</td>
            <td>Dosen</td>
            <td></td>
            <td>2018-12-17</td>
  </tr>
  <tr>
            <td>1204411667</td>
            <td>RISDAYANTI</td>
            <td>Alumni</td>
            <td></td>
            <td>2018-10-17</td>
  </tr>
  <tr>
            <td>1204411778</td>
            <td>PUTRI</td>
            <td>Mahasiswa</td>
            <td></td>
            <td>0000-00-00</td>
  </tr>
  <tr>
            <td>1204411220</td>
            <td>SINTIA</td>
            <td>Alumni</td>
            <td></td>
            <td>2018-11-12</td>
  </tr>
 
 </table>
</body>
</html>


TAMPILANNYA

Pencarian Anggota
:
ID Anggota*
:
Nama Anggota*
:
Tanggal Lahir
:
Anggota Sejak*
:
Tanggal Registrasi*
:
Berlaku Hingga*
:
Institusi
:
Tipe Keanggotaan*
:
Jenis Kelamin
:
Laki-Laki
Perempuan
Alamat
:
Kode Pos
:
Alamat Surat
:
No Hp
:
Nomor Fax
:
Nomor Identitas
:
Catatan
:
Tanda Keanggotaan
:
Ya
Foto
:



Tidak ada komentar:

Posting Komentar