A.PENDAHULUAN
Selamat malam dan sejahtera untuk kita semua.Bertemu lagi dengan saya yaitu untuk bertukar informasi lewat blog ini,dan kali ini saya akan membahas tentang cara membuat absensi menggunakan html dan css.
B.LATAR BELAKANG
Ingin menerapkannya di absensi kelas saya supaya lebih simpel.
C.MAKSUD DAN TUJUAN
Agar lebih mudah cara absensinya dan tidak membuang -buang waktu.
D.ALAT DAN BAHAN
-Leptop
-Sublime text
E.HASIL YANG DIHARAPKAN
Ingin menerapkannya di absensi sekolah dan bisa digunakan untuk database dalam sebuah website sekolah.
F.PEMBAHASAN
Setelah memahami dasar-dasar html saya akan memberitahu bagaimana membuat absensi tang simpel dan mudah ,mari kita bahas :
- Buka sublime text
- Save dulu lalu formatnya html misal(terserah.html)
- masukkan kode htmlnya
ini kodenya
<!DOCTYPE html>
<html>
<head>
<title>Absensi kelas</title>
</head>
<style type="text/css">
#footer{
text-align: center;
padding: 20px;
background-color: #B7B1B1;
}
table.s, table.s tr,table.s td {
border: 1px solid #000;
}
#f {
width: 500px;
}
body {
color: blue;
}
</style>
<body>
<h2 text align="center">SMK NEGERI 1 BANGSRI</h2>
<h1 text align="center">REKAYASA PERANGKAT LUNAK</h1>
<table align="center" rules="rows" margin="1px">
<tr>
<td></td>
</tr>
<tr>
<td><h4>Alamat:Jl.KH Achmad Fauzan,No.17 Bangsri Jepara | Telp: ( 0291 ) 772321</h4></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<h3><center>ABSENSI KELAS</center></h3>
<h3><center>SEMESTER GANJIL TAHUN AJARAN 2018/2019</center></h3>
<br/>
<table style=" margin: 0 auto; width: 700px;">
<tr>
<td id="f">Wali Kelas</td>
<td>:</td>
<td>Mrs.Indah Rahmawati</td>
<td id="f">Program Keahlian</td>
<td>:</td>
<td>Rekayasa Perangkat Lunak</td>
</tr>
<tr>
<td id="f">Kelas</td>
<td>:</td>
<td>XI RPL 1</td>
<td id="f">Jumlah murid</td>
<td>:</td>
<td>15(Lima Belas)</td>
</tr>
</table>
<br/>
<br/>
<table width="900px" border="1" align="center">
<tr bgcolor="#FFF200">
<th rowspan="2">NO</th>
<th rowspan="2">NAMA</th>
<th rowspan="2">KETERANGAN</th>
</tr>
<tr bgcolor="fff200">
<td align="center" width="25">A</td>
<td align="center" width="25">S</td>
<td align="center" width="25">I</td>
</tr>
<tr align="center">
<td>1</td>
<td>Aditya Akbar</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>2</td>
<td>Ridlo Utomo</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>3</td>
<td>Aldi Abdullah Z</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>4</td>
<td>Ali Rohmad</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>5</td>
<td>Dimas Ariyanto</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>6</td>
<td>Dio Wilyan Aloysius F</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>7</td>
<td>Fachrur Nur Ahmad Qoyum</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>8</td>
<td>Ferry Kurniawan</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>9</td>
<td>Firmansyah Adi Waluyo</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>10</td>
<td>Muhammad Farid A</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>11</td>
<td>Myhammad Faizal R</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>12</td>
<td>Myhammad Alan Mahya A</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>13</td>
<td>Nor Rohmad</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>14</td>
<td>Rama Aldiansyah</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr align="center">
<td>15</td>
<td>Zainal Abidin</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<br />
<table border="0">
<tr>
<td style="text-indent: 220px;">Keterangan : Jika tidak masuk sekolah tanpa keterangan di denda Rp.20.000</td>
</tr>
</table>
<br />
<div id="footer">
Salam sejahtera untuk kita semua ,Wassalamualikum Wr.Wb
</div>
</body>
</html>
G.KESIMPULAN
Itulah contoh kode html untuk membuat absensi
H.PENUTUP
Sekian dari saya semoga bermanfaat dan sanpai jumpa.
Wassalamualaikum Wr.Wb
ADS HERE !!!