Cara Membuat Tabel Biodata Diri Keren Dengan HTML

Cara membuat tabel biodata diri dengan HTML. Sebagai mahasiswa IT, pasti kita mendapatkan mata kuliah tentang dasar-dasar pemrograman web (web programming). Salah satunya kita akan mendapatkan pengertian mengenai dasar HTML. Mungkin saya atau anda bosan dengan beberapa data diri yang hanya dapat terlihat secara offline maupun online melalui media sosial (social media). Kali ini kita akan mencoba mempraktekkan bagaimana membuat sintak atau koding sebuah file HTML dengan cara membuat tabel biodata diri dengan HTML yang akan dimunculkan pada browser-browser yang anda miliki dengan mengklik data tersebut yang telah disimpan oleh notepad or notepad ++ ataupun adobe dreamweaver, dan lain sebagainya sebagai file HTML.

Tabel Data Diri Aldee Share

Baiklah, kalau begitu, kita mulai saja, kalau basa-basi mlulu, nanti tutorial ini jadi basi. hehe

1) Langkah pertama, buka dulu program Notepad++ / Adobe dreamweaver. Jika belum punya, silakan download terlebih dahulu.

2) Kalau sudah, dibuka programnya dan ketikkan kode dibawah ini.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

<!DOCTYPE html>
<html>
<head>
<title>BIODATA DIRI</title>
</head>
<body>
<h1 align="center">BIODATA DIRI</h1>
<table width="745" border="1" cellspacing="0" cellpadding="5" align="center">
<tr align="center" bgcolor="#66CC33">
<td width="174">DATA DIRI</td>
<td width="353">KETERANGAN</td>
<td width="232">FOTO</td>
</tr>
<tr>
<td>Nama</td>
<td>Aldi Alamari</td>
<td rowspan="10" align="center"><img src="Alde.jpg" width="210" height="313"></td>
</tr>
<tr>
<td>Asal Sekolah</td>
<td>SMKN 1 LMBOTO</td>
</tr>
<tr>
<td>Tempat Tgl Lahir</td>
<td>Limboto, 16 November 2003</td>
</tr>
<tr>
<td>Jurusan</td>
<td>Multimedia (MM)</td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>Laki-laki</td>
</tr>
<tr>
<td>Kewarganegaraan</td>
<td>Indonesia</td>
</tr>
<tr>
<td>Status</td>
<td>Pelajar</td>
</tr>
<tr>
<td>Alamat</td>
<td>Jl. Hasan Dangkua, Kel. Kayumerah, Kec. Limboto</td>
</tr>
<tr>
<td>Kelainan Khusus</td>
<td>Tidak Ada</td>
</tr>
<tr>
<td>Hobi & Bakat</td>
<td>Dokumenter Video Editing & Web Design</td>
</tr>
</table>
</body>
</html>

catatan : Ganti Tulisan yg Berwarna Merah di bagian pengantian foto , letakan foto kalian dalam satu folder baru, usahakan nama foto dalam folder harus sama dengan yg ada di notepadd contoh Aldee.jpg, yg ada di point ke 17

3) Jika sudah, segera di Save As…, dengan format penyimpanan Hyper Text Markup Language / .html. Jika sudah di save, buka filenya di Web Browser seperti Explorer, Firefox, Google Chrome, atau Safari dimana tadi anda simpan.

4) Terima kasih telah berkunjung ke website ini.

Search

Aldee Share

List me