Source Code HTML :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>website KAI</title>
<body class="bodystyles">
<ul>
<li><a class="active" href="#home">Pemesanan Tiket Kereta Api Online</a></li>
<li><a href="#news">Daftar Harga Kelas KA</a></li>
<li><a href="#contact">Daftar Jadwal KA</a></li>
<li><a href="#about">Daftar Pesanan Tiket</a></li>
</ul>
<div class="header">
<img src="kaai.png" alt="LogoKAI" />
<h1>Selamat Datang !!!</h1>
</div>
<br><br>
<hr>
<div>
<table class="tablestyles" >
<form name ="input" action="html_form_action.asp" method="get">
<tr><td> Nama Kereta:</td><td><input type="text" name="name" align="center" id="name" required></td></tr>
<tr><td> Tanggal Berangkat:</td><td><input type="date" name="departdate" align="center" required></td></tr>
<tr><td> Tanggal Tiba:</td><td><input type="date" name="arrivedate" align="center" required></td></tr>
<tr><td> Jam Berangkat:</td><td><input type="time" name="departtime" align="center" required></td></tr>
<tr><td> Jam Tiba:</td><td><input type="time" name="arrivetime" align="center" required></td></tr>
<tr><td> Dari:</td> <td><input type="text" name="from" align="center" required></td></tr>
<tr><td> Ke:</td><td><input type="text" name="to" align="center" required></td></tr>
<tr><td> Kelas:</td><td><select name="Kelas" form="kelasform">
<option value="Eksekutif">Eksekutif</option>
<option value="Bisnis">Bisnis</option>
</select></td></tr>
<tr>
<td><button type="button" style="background-color: #008CBA; border-radius: 4px; color: white; width: 80px; height: 40px">Simpan</button></td>
<td><button type="button" style="background-color: #f44336; border-radius: 4px; color: white;width: 80px; height: 40px;">Batal</button></td><br>
</tr>
</table>
</div>
<div class="tablestyles1">
<table>
<tr>
<th>No</th>
<th>Nama Kereta</th>
<th>Jadwal Berangkat</th>
<th>Jadwal Tiba</th>
<th>Dari</th>
<th>Ke</th>
<th>Harga(Kelas)</th>
</tr>
<tr>
<td align="center">1</td>
<td align="center">Argo Parahyangan</td>
<td align="center">2014-04-22 - 06:00</td>
<td align="center">2014-04-22 - 08:45</td>
<td align="center">Gambir, Jakarta Pusat</td>
<td align="center">Bandung, Bandung</td>
<td align="center">Bisnis - 90.000</td>
<td class="input1"><button type="button" style="background-color: #008CBA; border-radius: 4px; color: white; width: 80px; height: 40px">Edit</button> <button type="button" style="background-color: #f44336; border-radius: 4px; color: white; width: 80px; height: 40px">Hapus</button></td>
</tr>
<tr>
<td align="center">2</td>
<td align="center">Argo Parahyangan</td>
<td align="center">2014-04-23 - 13:01</td>
<td align="center">2014-04-23 - 15:00</td>
<td align="center">Gambir, Jakarta Pusat</td>
<td align="center">Surabaya</td>
<td align="center">Eksekutif - 100.000</td>
<td class="input2"><button type="button" style="background-color: #008CBA; border-radius: 4px; color: white; width: 80px; height: 40px">Edit</button> <button type="button" style="background-color: #f44336; border-radius: 4px; color: white; width: 80px; height: 40px">Hapus</button></td>
</tr>
</table>
</div>
</body>
</head>
</html>
Tampilan :
No comments:
Post a Comment