Scribd Logo
Upload

Welcome to Scribd!

  • M.Surya E.J - 10

    Uploaded by

    The Sur
    8 views9 pages
    The document is a PKKWU report by Muhammad Surya Eka Julianto of SMK Dwiya Bhakti 1 Jombang. It includes: 1) A script for a student data table with CSS formatting. 2) A script to add new student data to the table. 3) The CSS file used to style the student data pages. The report demonstrates skills in creating a student database application using HTML, CSS, and PHP.

    Original Description:

    Original Title

    M.Surya E.J_10

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document is a PKKWU report by Muhammad Surya Eka Julianto of SMK Dwiya Bhakti 1 Jombang. It includes: 1) A script for a student data table with CSS formatting. 2) A script to add new student data to the table. 3) The CSS file used to style the student data pages. The report demonstrates skills in creating a student database application using HTML, CSS, and PHP.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    8 views9 pages

    M.Surya E.J - 10

    Uploaded by

    The Sur
    The document is a PKKWU report by Muhammad Surya Eka Julianto of SMK Dwiya Bhakti 1 Jombang. It includes: 1) A script for a student data table with CSS formatting. 2) A script to add new student data to the table. 3) The CSS file used to style the student data pages. The report demonstrates skills in creating a student database application using HTML, CSS, and PHP.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 9

    LAPORAN PKKWU

    MUHAMMAD SURYA EKA JULIANTO


    X TKJ 3
    10

    JURUSAN TEKNIK KOMPUTER DAN JARINGAN


    SMK DWIJA BHAKTI 1 JOMBANG
    2022
    A.Script Latihan 1

    <html>

    <head>

    <title>Data Mahasiswa</title>

    <link rel="stylesheet" href="mystyle.css" media="all" /> <!--rel="styesheet" = Menunjukkan bahwa


    file yang dirujuk adalah file stylesheet (CSS). href attribute digunakan untuk menentukkan lokasi file
    (CSS) yang ingin disisipkan. -->

    </head>

    <body>

    <h2>Data Mahasiswa</h2>

    <br>

    <br>

    <h2>MUHAMMAD SURYA EKA JULIANTO</h2>

    <table class='dttabel' width='100%'>

    <tr>

    <th>No.</th>

    <th>NO. Induk</th>

    <th>Nama Mahasiswa</th>

    <th>JK</th>

    <th>Tgl. Lahir</th>

    <th>Alamat</th>

    <th>Dosen Pembimbing</th>
    <th>NO. Telepon</th>

    </tr>

    <tr>

    <td>1</td>

    <td>160202340010</td>

    <td>Agus</td>

    <td>L</td>

    <td>02-10-1990</td>

    <td>Malang</td>

    <td>Bambang</td>

    <td>081233456789</td>

    </tr>

    <tr>

    <td>2</td>

    <td>160202340013</td>

    <td>Budi</td>

    <td>L</td>

    <td>03-02-1991</td>

    <td>Surabaya</td>

    <td>Atin</td>

    <td>081145673456</td>

    </tr>
    <tr>

    <td>3</td>

    <td>160202340017</td>

    <td>Cahaya</td>

    <td>P</td>

    <td>06-05-1991</td>

    <td>Blitar</td>

    <td>Atin</td>

    <td>081334556689</td>

    </tr>

    <tr>

    <td>4</td>

    <td>160202340018</td>

    <td>Doni</td>

    <td>L</td>

    <td>05-12-1990</td>

    <td>Malang</td>

    <td>Samsuddin</td>

    <td>-</td>

    </tr>

    </table>

    <br><a href='add3.html'>Add Data</a>


    </body>

    </html>

    B. ADD Script

    <html>

    <head>

    <title>Data Mahasiswa</title>

    <link rel="stylesheet" href="mystyle.css" media="all" />

    </head>

    <body>

    <h2>TAMBAH DATA MAHASISWA</h2>

    <table class="dttabel" width="100%"

    <form action='tambah.php'>

    <tr>

    <td width='140px'>No. Induk</td>

    <td width='1px'>:</td>

    <td width='1px'><input type='text' name='noinduk' maxlength='12'></td>

    </tr>

    <tr>

    <td>Nama Mahasiswa</td>

    <td>:</td>

    <td><input type='text' name='nama' maxlength='50'></td>

    </tr>

    <tr>

    <td>JK</td>

    <td>:</td>

    <td><input type="radio" name="jk" value="L" checked> Laki-laki<input type="radio" name="jk"


    value="P">Perempuan</td>
    </tr>

    <tr>

    <td>Tgl. Lahir</td>

    <td>:</td>

    <td><input type='date' name='tgllahir'></td>

    </tr>

    <tr>

    <td>Alamat</td>

    <td>:</td>

    <td><textarea name="alamat" rows="10" cols="30"></textarea></td>

    </tr>

    <tr>

    <td>Dosen Pembimbing</td>

    <td>:</td>

    <td><input type='text' name='dosen' maxlength='50'></td>

    </tr>

    <tr>

    <td>No. Telepon</td>

    <td>:</td>

    <td><input type='Tel' name='telp' maxlength='50'></td>

    </tr>

    <tr>

    <td colspan='3'><input type='submit' value='Proses'><input type='reset' value='Batal'></td>

    </tr>

    </form>

    </table>

    </body>
    </html>

    C.Mystyle CSS

    @charset "utf-8"

    body{background-color:#ecf0f1; font-family:arial;}

    h2 {color: #34495e; font-weight: bold; letter-spacing: .4em;margin-bottom: lem; text-transform:


    uppercase; text-align:center;}

    .dttabel{ border-spacing:0; border-collapse:collapse;vertical-align: middle; }

    .dttabel th {padding:5px 5px;color: #ecf0f1;background-color:#34495e; letter-spacing: .lem; text-


    transform: uppercase; }

    .dttabel th:first-child {border-left:1px solid #34495e; }

    .dttabel th:last-child {border-right:1px solid #34495e; }

    .dttabel tr:nth-child(odd) { height:25px;color: #34495e; background-color:#bdc3c7; font-


    weight:600; }

    .dttabel tr:nth-child(even) { height:25px;color: #34495e; background-color:#ecf0f1; }

    .dttabel tr:last-child {border-bottom:1px solid #34495e; }

    .dttable td:first-child {border-left:1px solid #34495e; }

    .dttabel td:last-child {border-right:1px solid #34495e; }

    .dttabel td:nth-child(1) { text-align:center; } .dttabel td:nth-child(2) { text-align:center; } .dttabel


    td:nth-child(4) { text-align:center; } .dttabel td:nth-child(5) { text-align:center; } .dttabel td:nth-
    child(8) { text-align:center; }

    .dttabel tbody tr:hover { background: lime; }

    a {padding:5px 15px 5px 15px; background-color:#34495e;text-decoration:none;}

    a :link {color: #ecf0f1;} a:visited {color: #ecf0f1;} a:hover {color: yellow;}

    a :active {color: yellow; font-weight:600; padding:5px 14px 5px 13px;}

    .frtabel{border-spacing:0px; border-collapse:collapse;vertical-align: middle;}

    .frtabel caption {padding:5px 5px;color: #ecf0f1;background-color:#34495e; letter-


    spacing: .lem; text-transform: uppercase; text-align:right;font-weight:600; border:1px solid #34495e:
    }
    .frtabel td:nth-child(1) { text-align:right; height:25px; color:#34495e;background-
    color:#bdc3c7; font-weight:600; padding:3px 10px 3px 10px; }

    .frtabel td:nth-child(2) { text-align:left; height:25px; color:#34495e;padding:3px 10px 3px


    10px; }

    .frtabel td:last-child { border-bottom:1px solid #bdc3c7; border-right:1px solid #bdc3c7; }

    .frtabel tr:nth-child(5) {vertical-align:top;}

    input[type=text] {border:0px;height:25px;width:100%;background-color:#ecf0f1;color:
    #34495e;}

    input[type=date] {border:0px;height:25px;width:100%;background-color:#ecf0f1;color: #34495e;}

    input[type=Tel] {border:0px;height:25px;width:100%;background-color:#ecf0f1;color: #34495e;}

    input:focus {background-color:#FFF;}

    textarea{border:0px;height:25px;width:100%;background-color:#ecf0f1;color:
    #34495e;height:100px;}

    textarea:focus {background-color:#FFF;}

    input[type=submit] {background-color:#34495e;height:25px;width:49%;color:
    #ecf0f1;border:0px;}

    input[type=reset] {background-color:#34495e;height:25px;width:49%;color:
    #ecf0f1;border:0px;}

    D.Bukti SS
    E.Kesimpulan

    RUWETTT,NGELUU,ADEMM PANASS

    You might also like