* { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; } body { background-color: black; } .badan { width: 880px; margin: 35px auto; background-color: white; padding: 20px; overflow: hidden; } .badan h2 { color: crimson; border-bottom: 1px solid gainsboro; margin: 5px; margin-bottom: 13px; } .list-produk { border: 1px solid gainsboro; padding: 10px; float: left; width: 200px; margin: 5px; } .list-produk:hover { transition-duration: 700ms; box-shadow: 5px 5px gainsboro; } .list-produk img { width: 100%; height: 175px; display: block; margin-bottom: 5px; } .list-produk h4, .list-produk h5 { color: crimson; text-align: center; margin-bottom: 5px; } .tombol { text-decoration: none; border-radius: 7px; padding: 7px; display: block; float: left; width: 45%; margin: 4px; text-align: center; color: white; } .tombol:hover { background-color: black; transition-duration: 700ms; } .tombol-detail { background-color: green; } .tombol-beli { background-color: crimson; }
Skip to content Skip to sidebar Skip to footer
Home / html

Tutorial Cara Membuat Validasi Dengan HTML

Pada artikel singkat ini saya akan share tentang Tutorial Cara Membuat Validasi Dengan HTML Fungsi validasi ini yaitu ketika pengguna mengisi suatu form yang kosong maka sistem tidak akan menerima proses form tersebut sampai form tersebut diisi.

Disini kita menggunakan Validasi dengan HTML, walaupun dengan html tetapi masih dapat digunakan loh walaupun dengan menggunakan html ini tidak menarik. Langsung saja kita simak tutorial berikut ini.

Tutorial Cara Membuat Validasi Dengan HTML

1. Buat file dengan nama validasi.html
Langkah pertama yaitu buatlah file html dengan nama validasi.html lalu, ketikan kode di bawah ini.
<html>
<head>
<title>Membuat Validasi Dengan HTML</title>
</head>
<body>
<form method="POST" action="#">
  <label>Nama</label>
  <input type="text" name="nama" required>

  <button type="submit">Simpan</button>
</form>
</body>
</html>

2. Simpan
Kedua, simpan file tersebut lalu jalankan di browser anda lalu klik tombol Simpan tanpa mengisi kolom nama. Maka, setelah dijalankan akan muncul tampilan seperti di bawah ini.


Penjelasan :
Perhatikan pada kode di atas, anda akan melihat kode ini.

<input type="text" name="nama" required>

Kode tersebut terdapat kata required yang artinya perlu. oleh karena itu form tersebut tidak dapat disimpan karena form nama harus diisi sebelum diproses oleh sistem.

Itulah tutorial singkat Tutorial Cara Membuat Validasi Dengan HTML, cara menggunakannya saya rasa cukup mudah untuk diterapkan. Cukup sampai disini semoga bermanfaat untuk anda. Terima kasih
m