form

<!DOCTYPE html>
<html>
<head>
	<title> PENDAFTARAN EKSKUL </title>
	<style>
	#yeay{
		font-size: 40px;
		font-family: segoe print;
		text-align: center;
	}

	h1{
		font-size: 40px;
		font-family: segoe print;
		color: white;
	}

	#warna{
		background-color: #42C667;
	}

	#tels{
		font-family: arial;
	}

	*{
		margin: 0;
		padding: 0;
	}

	#alamat{
		margin-left: 15px;
	}

	#color{
		background-color: #42C667;
	}

	#kelamin{
		margin-left: 15px;
	}

	#depan{
		margin-left: 15px;
	}

	#nis{
		margin-left: 15px;
	}

	#kelas{
		margin-left: 15px;
	}

	#hobby{
		margin-left: 15px;
	}

	#agama{
		margin-left: 15px;
	}

	#eks{
		margin-left: 15px;
	}
	</style>
</head>
<body>
	<div id="warna">
	<div id="tels"><b> SMK Telekomunikasi Telesandi Bekasi </b></div>
	<h1 align="center"><b> FORM PENDAFTARAN EKSKUL </b></h1>
	</div>

	<hr>

	<form>
		<b>NAMA : </b><br>
		<input id="depan" type="text" placeholder="Nama Depan">
		<input type="text" placeholder="Nama Belakang"><br>
		<b>NIS : </b><br>
		<input id="nis" type="text" placeholder="NIS Anda"><br>
		<b>KELAS : </b><br>
		<input id="kelas" type="text" placeholder="Kelas Anda"><br><br>

		<hr>

		<b>JENIS KELAMIN : </b><br>
		<div id="kelamin"><input type="radio" name="kelamin" value="cowo"> Laki-laki <br>
		<input type="radio" name="kelamin" value="cewe"> Perempuan <br><br>
		</div>

		<hr>

		<b>HOBBY : </b><br>
		<div id="hobby"><input type="checkbox"> Badminton <br>
		<input type="checkbox"> Jogging <br>
		<input type="checkbox"> Membaca <br>
		<input type="checkbox"> Berenang <br>
		<input type="checkbox"> Futsal <br><br>
		</div>

		<hr>

		<b>AGAMA : </b><br>
		<div id="agama"><input type="radio" name="agama" value="islam"> Islam <br>
		<input type="radio" name="agama" value="khatolik"> Khatolik <br>
		<input type="radio" name="agama" value="hindu"> Hindu <br>
		<input type="radio" name="agama" value="budha"> Budha <br>
		<input type="radio" name="agama" value="protestan"> Protestan <br><br>
		</div>

		<hr>

		<b>ALAMAT : </b><br>
		<textarea id="alamat" rows="5" cols="50">
		</textarea><br><br>

		<hr>

		<b> EKSTRAKURIKULER : </b><br>
		<div id="eks"><input type="checkbox" name="syntax"> Syntax <br>
		<input type="checkbox" name="voli"> Voli <br>
		<input type="checkbox" name="bengkel"> Bengkel Matematika <br>
		<input type="checkbox" name="senmed"> Seni Media <br>
		<input type="checkbox" name="tomcat"> Tomcat <br>
		<input type="checkbox" name="futsal"> Futsal <br>
		<input type="checkbox" name="taekwondo"> Taekwondo <br>
		<input type="checkbox" name="basket"> Basket <br>
		<input type="checkbox" name="robotik"> Robotik <br>
		<input type="checkbox" name="paskibra"> Paskibra <br>
		<input type="checkbox" name="magazine"> TelsMagazine <br>
		<input type="checkbox" name="lain"> Dll <br><br>
		</div>

		<input type="button" onclick="alert('SELAMAT BERGABUNG!')" value="Kirim"></a>
		<input type="reset" value="Reset">

		<hr>

		<div id="color">
		<div id="yeay"><b> TERIMA KASIH ^_^ </b></div>
		</div>

		<hr>

	</form>
</body>
</html>