Code:
Hasil:
Nama : R. Sidqi Tri P.
NRP : 5115100153
Kelas : Pemrograman Web D
<!DOCTYPE html>
<html>
<head>
<title>Formulir Registrasi Lomba Cerdas Cermat</title>
<style type="text/css">
body {
font-size: 40px;
font-family: "Comic Sans MS";
}
h1 {
color: red;
}
td {
padding: 15px;
padding-bottom: 2px;
padding-top: 2px;
}
#registrasi input, select{
width: 300px;
border: 1px solid #000099;
border-radius: 5px;
font-size: 20px;
padding: 5px;
}
#registrasi input[value="Daftar"]{
height: 70px;
width: 120px;
color: white;
background-color: #339966;
cursor:pointer;
}
#registrasi input[value="Daftar"]:hover{
background-color: #67A8FF;
}
#registrasi input[value="Batal"]{
height: 70px;
width: 120px;
color: white;
background-color: ##cc0000;
cursor:pointer;
}
#registrasi input[value="Batal"]:hover{
background-color: #FF6666;
}
</style>
<script>
function popUp(){
window.alert("Terima kasih, Anda sudah terdaftar!:)");
}
</script>
</head>
<body>
<form id="registrasi" method="get">
<table align="center" >
<tr>
<td colspan="2" align="center"><h2>Formulir Registrasi Lomba Cerdas Cermat</h2></td>
</tr>
<tr>
<td>Nama Peserta</td>
<td><input type="text" name="Nama Peserta"/> </td>
</tr>
<tr>
<td>NISN</td>
<td><input type="text" name="NISN" list="NISN"/>
<datalist id="NISN">
<option value="00001">
<option value="00002">
<option value="00003">
<option value="00004">
<option value="00005">
</datalist>
</td>
</tr>
<tr>
<td>Mata Pelajaran</td>
<td><input type="text" name="Mata Pelajaran" list="Mata Pelajaran"/>
<datalist id="Mata Pelajaran">
<option value="Matematika">
<option value="Fisika">
<option value="Kimia">
<option value="Biologi">
</datalist>
</td>
</tr>
<tr>
<td>Tingkat Sekolah</td>
<td><input type="text" name="Tingkat Sekolah"/> </td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="Daftar" onclick="popUp()"/>
<input type="submit" value="Batal"/>
</td>
</tr>
</table>
</form>
</body>
</html>
Hasil:
NRP : 5115100153
Kelas : Pemrograman Web D
Tidak ada komentar:
Posting Komentar