Bismillah...
Lanjut! Setelah kemarin belajar tentang Git dan Github, hari ini masih belajar hal basic. Membuat form dan table.
Saya mencoba membuat html dari mock up gambar ini:
Dan ini hasil punya saya:
Oh ya kemarin saya mendapat pertanyaan dari sesama peserta bagaimana cara saya menyisipkan gambar tong sampah di table hapus. Sebenarnya saya pake icon dari FontAwesome sebuah icon library.
Berikut langkah-langkah menyisipkan icon di file html local:
- Daftar akun di FontAwesome.com ikuti prosesnya sampai berhasil masuk dashboard.
-
Lihat bagian Kit, dan cari tab set up. Nanti akan ada script yang
digunakan untuk instalasi.
-
Copy script tersebut dan paste di atas tag </head> file html lalu simpan
- Untuk menyisipkan icon, buka lagi web Font Awesome dan ketik di pencarian nama icon yang mau dipakai (pakai bahasa Inggris ya) misal Trash.
-
Klik icon Trash, nanti akan muncul kode html
-
Copy code tersebut dan paste di file html kita
Kira-kira seperti ini html-nya nanti:
<!DOCTYPE html>
<html>
<head>
<title>Menyisipkan Font Awesome</title>
<script src="https://kit.fontawesome.com/abc123d45e.js" crossorigin="anonymous"></script>
</head>
<body>
<table>
<tr>
<th>Nama</th>
<th>Tanggal Lahir</th>
<th>Jenis Kelamin</th>
<th>Pesan</th>
<th>Profile</th>
<th>Hapus</th>
</tr>
<tr>
<td>Putri Dania</td>
<td>18 April 1993</td>
<td>Perempuan</td>
<td>Pemula koding</td>
<td><a href="https://dania.my.id/" target="_blank">Klik Disini</a></td>
<td><i class="fa-solid fa-trash-can"></i></td>
</tr>
</table>
</body>
</html>
Besok materinya tentang CSS, agak deg-degan sih karna sense design saya masih cetek.
Talk soon,
Dyah
Posting Komentar
Posting Komentar