Pertemuan 2

 Aisyahra Alhanni Satria

5053231010

Membuat tabel nilai dan membuat kolom login menggunakan bahasa html.

Kodingan html untuk membuat tabel nilai dan hasilnya:

<style>
    table {
        width: 50%;
        border-collapse: collapse;
        margin: auto;
    }
    th, td {
        border: 1px solid black;
        padding: 8px;
    }
    th {
        background-color: #0056b3;
        color: white;
        text-align: center;
    }
    td {
        text-align: left;
    }
</style>
<table>
    <tr>
        <th rowspan="2">Nama</th>
        <th colspan="3">Nilai</th>
    </tr>
    <tr>
        <th>Kimia</th>
        <th>Fisika</th>
        <th>Biologi</th>
    </tr>
    <tr>
        <td align="left" valign="middle">Robby</td>
        <td align="left">76</td>
        <td align="left">80</td>
        <td align="left">81</td>
    </tr>
    <tr>
        <td align="left" valign="middle">Rendi</td>
        <td align="left">84</td>
        <td align="left">70</td>
        <td align="left">75</td>
    </tr>
    <tr>
        <td align="left" valign="middle">Alfian</td>
        <td align="left">96</td>
        <td align="left">70</td>
        <td align="left">71</td>
    </tr>
</table>




Kemudian hasil dari kodingan di atas:



Kemudian ada kodingan html untuk membuat kolom login, sebagai berikut:
<!DOCTYPE html>
<html lang="en">
<head>
<style>
    .login-container {
        width: 300px;
        padding: 20px;
        border: 1px solid #ccc;
        border-radius: 5px;
        margin: 0 auto;
    }
</style>
</head>
<body>
    <div class="login-container">
    <b>Login</b>
    <form method="post" action="data.html">
        <table>
            <tr> <td>Username:</td>
            <td><input type="text" name="mahasigma" size="20"></td>
            </tr>
            <tr> <td>Password:</td>
            <td><input type="password"name="mewingeveryday"size="20"</td>
        </tr>
        </table>
        <input type="checkbox" value="Remember me">Remember me<br>
        <input type="submit" value="Login" name="t1">
    </form>
    </div>
</body>
</html>


Dan hasil dari kodingan tersebut seperti di bawah ini:



Sekian dari saya terhadap pertemuan kedua. Terima kasih banyak.

Comments

Popular posts from this blog

Tugas Study Case HTML5