<link href="https://fonts.googleapis.com/css?family=Bree+Serif&display=swap" rel="stylesheet">
<style type="text/css">
    table{
        border: 5px outset blue;
        background: linear-gradient(to bottom, #33ccff 0%, #ff3399 100%);
    }
    th{
        font-family: 'Bree Serif', serif;
        font-size: 30px;
    }
    td{
        font-family: 'Bree Serif', serif;
        font-size: 20px;
    }
    td.batas{
        height: 5px;
        border-radius: 50px;
        background-color: blue;
    }
</style>

<?php
    $nama = $_POST['nama'];
    $nilaiIndo = $_POST['nilaiIndo'];
    $nilaiMtk = $_POST['nilaiMtk'];
    $nilaiInggris = $_POST['nilaiInggris'];
    $nilaiKejuruan = $_POST['nilaiKejuruan'];
    $nilaiAkhir = ($nilaiIndo + $nilaiMtk + $nilaiInggris + $nilaiKejuruan) / 4;
?>

<table>
    <tr>
        <th colspan="2">Nilai Akhir</th>
    </tr>
    <tr>
        <td class="batas" colspan="2"></td>
    </tr>
    <tr>
        <td width="250px">Nama</td>
        <td>
            <?php
                echo $nama;
            ?>
        </td>
    </tr>
    <tr>
        <td>Nilai B. Indonesia</td>
        <td>
            <?php
                echo $nilaiIndo;
            ?>
        </td>
    </tr>
    <tr>
        <td>Nilai Matematika</td>
        <td>
            <?php
                echo $nilaiMtk;
            ?>
        </td>
    </tr>
    <tr>
        <td>Nilai B. Inggris</td>
        <td>
            <?php
                echo $nilaiInggris;
            ?>
        </td>
    </tr>
    <tr>
        <td>Nilai Teori Kejuruan</td>
        <td>
            <?php
                echo $nilaiKejuruan;
            ?>
        </td>
    </tr>
    <tr>
        <td>Nilai Akhir</td>
        <td>
            <?php
                echo $nilaiAkhir;
            ?>
        </td>
    </tr>
</table>