Jumat, 10 Maret 2017

Tugas 3 Pemrograman Web Kelas D

Code:
<!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:


Nama : R. Sidqi Tri P.
NRP : 5115100153
Kelas : Pemrograman Web D

Tidak ada komentar:

Posting Komentar

Related Posts Plugin for WordPress, Blogger...