Week 4 - Form

 Tugas Form

https://aldeen1.github.io/tugas4-pweb/


 Tugas minggu ini berupa form, form ini disertai kolom untuk memasukkan nama, course, gender, phone, address, email, password, dan re-type password. Untuk tugas ini, saya menggunakan tabel yang ada di dalam form untuk menghasilkan suatu bentuk yang lebih rapih dan enak dilihat. Selain itu, input yang dipakai dalam tugas ini berupa text, number, radio, dan submit. Dan juga ada tag select yang digunakan untuk menciptakan suatu dropdown pilihan di course dan phone.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Registration Page</title>
    <style>
        body{
            background-color: #8BD0FA;
        }
    </style>
</head>
<body>
    <main>
        <table>
            <form method="POST">
                <table>
                    <tr>
                        <td><label for="firstname:">Firstname:</label>
                        </td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><label for="middlename">Middlename: </label></td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><label for="lastname: ">Lastname: </label></td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><label for="course">Course: </label></td>
                        <td><select name="course" id="course">
                            <option value="PWEB">PWeb</option>
                            <option value="PMobile">PMobile</option>
                        </select></td>
                    </tr>
                    <tr>
                        <td><label for="gender">Gender: </label></td>
                    </tr>
                    <tr>
                        <td><input type="radio" name="" id=""> Male</td>
                    </tr>
                    <tr>
                        <td><input type="radio" name="" id=""> Female</td>
                    </tr>
                    <tr>
                        <td><input type="radio" name="" id=""> Other</td>
                    </tr>
                    <tr>
                        <td><label for="phone">Phone: </label></td>
                        <td colspan="2"><select name="" id="">
                            <option value="62">+62</option>
                            <option value="81">+81</option>
                            <option value="91">+91</option>
                        </select>
                        <input type="number" name="" id="" min="11" max="11111111111111">
                        </td>
                    </tr>
                    <tr>
                        <td><label for="address">Address:</label></td>
                    </tr>
                    <tr>
                        <td colspan="2"><textarea rows="10" cols="40" wrap="physical"></textarea></td>
                    </tr>
                    <tr>
                        <td><label for="email">Email:</label></td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><label for="password">Password: </label></td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><label for="repass">Re-type password: </label></td>
                        <td><input type="text" name="" id=""></td>
                    </tr>
                    <tr>
                        <td><input type="button" value="Submit"></td>
                    </tr>
                </table>
            </form>
        </table>
    </main>
</body>
</html>



Comments

Popular Posts