defrindr · March 3, 2024 07:19
diff --git a/biodata.html b/biodata.html
 <!-- program html, pada dasarnya harus diawali dengan <html>  -->
 <!-- dan diakhir dengan </html> -->
 <!-- untuk merepresentasikan bahwa program yang sedang dibuat adalah program html -->
 <html>

 <!-- head berfungsi untuk mengatur informasi terkait halaman -->
 <!-- biasanya digunakan ketika optimasi SEO -->
 <!-- referensi: https://thohirdev.com/tutorial/belajar-tag-head-pada-html/#:~:text=tag%20head%20adalah%20informasi%20yang,head%3E%20sebagai%20penutup%20tag%20head. -->
 <head>
  <!-- memberikan judul pada tab -->
  <title>Biodataku</title>
  <!-- memberikan skin kepada tag html -->
  <style>
    table,
    tr,
    td {
      /* memberikan garis tepi dengan ukuran 1px, style solid, dan warna hitam */
      /* referensi: https://www.w3schools.com/css/css_border.asp */
      border: 1px solid #000;
      /* menghapus jarak antar border */
      /* referensi: https://developer.mozilla.org/en-US/docs/Web/CSS/border-spacing */
      border-spacing: 0;
    }

    td {
      /* memberikan jarak 2px pada content didalam td */
      padding: 2px;
    }
  </style>
 </head>

 <!-- body, merupakan tag yang digunakan untuk menampung visual dari halaman website -->
 <body>
  <table>
    <!-- wrap baris menggunakan tbody : https://www.w3schools.com/tags/tag_tbody.asp -->
    <tbody>
      <!-- baris ke 1 -->
      <tr>
        <!-- menggunakan colspan untuk menggabungkan kolom -->
        <td colspan="3">
          <strong>Biodata</strong>
        </td>
      </tr>
      <!-- baris ke 2 -->
      <tr>
        <!-- menggabungkan 4 baris pada kolom ke 1 -->
        <td rowspan="4">
          <img src="./img.png" alt="" style="width: 100%;height: auto">
        </td>
        <td>Nama</td>
        <td>: Ryu</td>
      </tr>
      <!-- baris ke 3 -->
      <tr>
        <!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
        <td>Alamat</td>
        <td>: Perum ITS Surabaya</td>
      </tr>
      <!-- baris ke 4 -->
      <tr>
        <!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
        <td>Email</td>
        <td>:
          <!-- a : untuk membuat tulisan biru -->
          <!-- mailto: agar ketika di klik menuju aplikasi email yang tersedia pada perangkat -->
          <!-- target _blank: membuka tab baru -->
          <a href="mailto:[email protected]" target="_blank">[email protected]</a>
        </td>
      </tr>
      <!-- baris ke 5 -->
      <tr>
        <!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
        <td>FB</td>
        <td>:
          <!-- a : untuk membuat tulisan biru -->
          <!-- mailto: agar ketika di klik menuju aplikasi email yang tersedia pada perangkat -->
          <!-- target _blank: membuka tab baru -->
          <a href="http://facebook.com/anonymous" target="_blank">http://facebook.com/anonymous</a>
        </td>
      </tr>
      <!-- baris ke 6 -->
      <tr>
        <!-- Menggabungkan 3 Kolom -->
        <td colspan="3">
          - Iseng4h -
        </td>
      </tr>
      <tr></tr>
    </tbody>
  </table>
 </body>

 </html>
	<!-- program html, pada dasarnya harus diawali dengan <html> -->
	<!-- dan diakhir dengan </html> -->
	<!-- untuk merepresentasikan bahwa program yang sedang dibuat adalah program html -->
	<html>

	<!-- head berfungsi untuk mengatur informasi terkait halaman -->
	<!-- biasanya digunakan ketika optimasi SEO -->
	<!-- referensi: https://thohirdev.com/tutorial/belajar-tag-head-pada-html/#:~:text=tag%20head%20adalah%20informasi%20yang,head%3E%20sebagai%20penutup%20tag%20head. -->
	<head>
	<!-- memberikan judul pada tab -->
	<title>Biodataku</title>
	<!-- memberikan skin kepada tag html -->
	<style>
	table,
	tr,
	td {
	/* memberikan garis tepi dengan ukuran 1px, style solid, dan warna hitam */
	/* referensi: https://www.w3schools.com/css/css_border.asp */
	border: 1px solid #000;
	/* menghapus jarak antar border */
	/* referensi: https://developer.mozilla.org/en-US/docs/Web/CSS/border-spacing */
	border-spacing: 0;
	}

	td {
	/* memberikan jarak 2px pada content didalam td */
	padding: 2px;
	}
	</style>
	</head>

	<!-- body, merupakan tag yang digunakan untuk menampung visual dari halaman website -->
	<body>
	<table>
	<!-- wrap baris menggunakan tbody : https://www.w3schools.com/tags/tag_tbody.asp -->
	<tbody>
	<!-- baris ke 1 -->
	<tr>
	<!-- menggunakan colspan untuk menggabungkan kolom -->
	<td colspan="3">
	<strong>Biodata</strong>
	</td>
	</tr>
	<!-- baris ke 2 -->
	<tr>
	<!-- menggabungkan 4 baris pada kolom ke 1 -->
	<td rowspan="4">
	<img src="./img.png" alt="" style="width: 100%;height: auto">
	</td>
	<td>Nama</td>
	<td>: Ryu</td>
	</tr>
	<!-- baris ke 3 -->
	<tr>
	<!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
	<td>Alamat</td>
	<td>: Perum ITS Surabaya</td>
	</tr>
	<!-- baris ke 4 -->
	<tr>
	<!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
	<td>Email</td>
	<td>:
	<!-- a : untuk membuat tulisan biru -->
	<!-- mailto: agar ketika di klik menuju aplikasi email yang tersedia pada perangkat -->
	<!-- target _blank: membuka tab baru -->
	<a href="mailto:[email protected]" target="_blank">[email protected]</a>
	</td>
	</tr>
	<!-- baris ke 5 -->
	<tr>
	<!-- baris ke 3 sampai dengan ke 5, kolom pertama tidak di tulis ulang, karena sudah di gabung pada baris ke 2 -->
	<td>FB</td>
	<td>:
	<!-- a : untuk membuat tulisan biru -->
	<!-- mailto: agar ketika di klik menuju aplikasi email yang tersedia pada perangkat -->
	<!-- target _blank: membuka tab baru -->
	<a href="http://facebook.com/anonymous" target="_blank">http://facebook.com/anonymous</a>
	</td>
	</tr>
	<!-- baris ke 6 -->
	<tr>
	<!-- Menggabungkan 3 Kolom -->
	<td colspan="3">
	- Iseng4h -
	</td>
	</tr>
	<tr></tr>
	</tbody>
	</table>
	</body>

	</html>