Kamis, 09 Maret 2017

Tugas HTML dan CSS

CODE :
<!DOCTYPE html>
<html>
<head>
    <title>[5114100072] Tutorial Form Dasar</title>
<link rel="stylesheet" type="text/css" href="judul.css">
    <title></title>
</head>
<body style="background: rgb(230, 204, 255);">
<img src="kai2.png" style="height: 120px;">
<h1>Selamat Datang </h1>

<form name="input" action="html_form_action.asp" method="get" style="text-align: right; margin-right: 50%">
    Nama Kereta    : <input type="text" name="namakereta"></br>
    Tanggal Berangkat : <input type="date" name="tglbrk"></br>
    Tanggal Tiba : <input type="date" name="tgltiba"></br>
    Jam Berangkat : <input type="time" name="jambrk"></br>
    Jam Tiba : <input type="time" name="jamtiba"></br>
    Dari : <input type="text" name="dari"></br>
    Ke : <input type="text" name="ke"></br>
    Kelas : <select name="carlist" form="carform">
                  <option value="Bisnis">Bisnis</option>
                  <option value="Eksekutif">Eksekutif</option>
              </select>
      <div style="text-align: center;">
            <button type="button" style="background-color: #008CBA; border-radius: 4px; color: white; width: 80px; height: 40px; text-align: right; margin-right: 10%">Simpan</button>
            <button type="button" style="background-color: #f44336; border-radius: 4px; color: white;width: 80px; height: 40px; text-align: right; margin-right: 10%">Batal</button>
        </div>
</form>
<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>
          <th></th>
      </tr>
      <tr>
        <td>1</td>
        <td>Argo Parahyangan</td>
        <td>2014-04-22 - 06.00</td>
        <td>2014-04-22 - 08.45</td>
        <td>Gambir, Jakarta Pusat</td>
        <td>Bandung, Bandung</td>
        <td>Bisnis - 90.000</td>
        <td><button type="button" style="background-color: #222D4A; border-radius: 4px; color: white; width: 80px; height: 40px">Edit</button>
        <button type="button" style="background-color: #fe5b18; border-radius: 4px; color: white;width: 80px; height: 40px;">Hapus</button>
        </td>
      </tr>
      <tr>
        <td>2</td>
        <td>Argo Parahyangan</td>
        <td>2014-04-23 - 13.01</td>
        <td>2014-04-23 - 15.00</td>
        <td>Gambir, Jakarta Pusat</td>
        <td>Surabaya</td>
        <td>Eksekutif - 100.000</td>
        <td><button type="button" style="background-color: #222D4A; border-radius: 4px; color: white; width: 80px; height: 40px">Edit</button>
        <button type="button" style="background-color: #fe5b18; border-radius: 4px; color: white;width: 80px; height: 40px;">Hapus</button></td>
      </tr>
    </table>
</body>
</html>

HASIL dari code:

Tidak ada komentar:

Posting Komentar