Tombol

Termasuk bagian Menata dengan CSS dalam perjalanan HTML di Coddy. Pelajaran 53 dari 76.

Tantangan

Mudah

Dalam pelajaran ini, kita akan menata tombol submit agar tampil menarik. Kamu akan menerapkan warna latar belakang, menyesuaikan warna teks dan padding, membulatkan sudut, serta menambahkan box-shadow pada formulir agar tampak menonjol.

Atur gaya elemen <button>. Ikuti langkah-langkah berikut:

Atur width menjadi 100% agar tombol memenuhi seluruh ruang.
Terapkan background-color sesuai pilihanmu.
Ubah text color agar font tampak menonjol.
Tambahkan padding untuk memperbaiki jarak.
Bulatkan sudutnya.
Terapkan property box-shadow pada tombol agar tampak menonjol dari latar belakang.

Coba sendiri

<html>
<head>
    <title>Login Form</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <form class="login-form">
        <h2>Login</h2>
        <input type="text" placeholder="Username">
        <input type="password" placeholder="Password">
        <button type="submit">Login</button>
    </form>
</body>
</html>