TUGAS DARING MATERI 4 BELAJAR HTML-TAG HTML

Tugas akhir kerja siswa menyelesaikan sebuah kasus dibawah ini.

1. Membuat bendera merah putih

• Berikut cara penulisan tag tagnya:

<html>

<head>

<title>bendera indonesia</title>

</head>

<body>

<center>

<table border="1" cellpadding="60" cellspacing="1" style="width: 100%;">

<tr style="background-color: red;">

  <td colspan="2"></td>

 </tr>

<tr style="bgcolor: white;">

   <td colspan="2"></td>

</tr>

</table>

<h1>

AKU CINTA INDONESIA</h1>

</center>

</body>

</html>

• Jika di tulis dalam menggunakan aplikasi Notepadd++ maka akan seperti ini:


• Maka hasil akan seperti ini:




2. Membuat Tabel Gabungan

• Berikut cara penulisan tagnya:

<!DOCTYPE html>
<html>
<body>
<center>
<table border="1" cellpadding="50" cellspacing="1">
<tr>
<td colspan="2" style="background-color:red"></td>
<td colspan="2" style="background-color:blue"></td>
<td colspan="2" style="background-color:blue"></td>
<td colspan="2" style="background-color:red"></td>
</tr>
<tr align="center">
<td colspan="2" style="background-color:blue"></td>
<td colspan="4" rowspan="2">
<h1>SMK 4</h1>
<h1>LPPM RI</h1>
<h1> PADALARANG</h1>
</td>
<td colspan="2" style="background-color:blue"></td>
</tr>
<tr align="center">
<td colspan="2" style="background-color:blue"></td>
<td colspan="2" style="background-color:blue"></td>
</tr>
<tr align="center">
<td colspan="2" style="background-color:red"></td>
<td colspan="2" style="background-color:blue"></td>
<td colspan="2" style="background-color:blue"></td>
<td colspan="2" style="background-color:red"></td>
</tr>
</table>
</body>
</html>


•Jika di tulis dalam Notepad++ akan seperti ini:



•Maka hasil akan seperti ini:


3.Membuat Tabel Absen Kelas

• Cara penulisan tagnya:

Berikut contoh kode html membuat absen:

<!DOCTYPE html>
<html>
<head>
<body>
<table border="1" cellpadding="1" cellspacing="1">
<tr>
<th align="center" colspan="4" style="background-color:blue">ANGGOTA GRUP KELAS XI RPL 1</th>
</tr>
<tr>
<th style="background-color:yellow">NO</th>
<th style="background-color:yellow">NAMA</th>
<th style="background-color:yellow">P/L</th>
<th style="background-color:yellow">ALAMAT BLOG</th>
</tr>
<tr>
<td>1</td>
<td>Yuni Sri M</td>
<td>P</td>
<td>http://yunisrimulyani pelajarperdulicovid19.blogspot.com</td>
</tr>
<tr>
<td>2</td>
<td>Pramesti Widia P</td>
<td>P</td>
<td>https://pramesti-pelajarpedulicovid19.blogspot.com</td>
</tr>
<tr>
<td>3</td>
<td> Fitri Rianti</td>
<td>P</td>
<td>https://fitririanti-pedulicovid19.blogspot.com/?m=1</td>
</tr>
<tr>
<td>4</td>
<td>Aulia Rahma</td>
<td>P</td>
<td>https://agystarahmaaulia blogspot.com</td>
</tr>
<tr>
<td>5</td>
<td>Nurul Azzahra</td>
<td>P</td>
<td>https://nurulazzahra.blogspot.com/?m=1</td>
</tr>
<tr>
<td>6</td>
<td>Mita Dwi A</td>
<td>P</td>
<td>http://anjanidwimita.blogspot.com</td>
</tr>
<tr>
<td>7</td>
<td>Muhammad Arya C</td>
<td>L</td>
<td>http://muhamadaryacitra blogspot.com/?m=1</td>
</tr>
<tr>
<td>8</td>
<td>Fajar Mustopa</td>
<td>L</td>
<td>https://fajarmustopa-pelajarperdulicovid19 blogspot.com</td>
</tr>
<tr>
<td>9</td>
<td>Chelsea K</td>
<td>P</td>
<td>https://chelseakhariun19.blogspot.com/?m=1</td>
</tr>
<tr>
<td>10</td>
<td>Vina Setia B</td>
<td>P</td>
<td>https://vinasetyavinasetya blogspot.com</td>
</tr>
</table>
</body>
</head>
</html>


•jika ditulis dalam notepadd++:




• Maka hasil akan seperti ini:

Tugas telah selesai hingga akhir. Terima kasih telah mengunjungi blog saya. 
Maaf apabila masih banyak kekurangan ataupun kesalahan dalam pembuatan HTML😊

Foto siswi yang sedang mengerjakan: 


Nama: Yuni Sri Mulyani
Kelas: XI Rekayasa Perangkat Lunak 1
Sekolah: LPPM RI PADALARANG


Komentar

Posting Komentar