Cara Membuat Kartu Nama dengan Tabel Keren
Dunia Programming - Pada kesempatan kali ini saya akan membagikan sedikit penjelasan bagaimana cara membuat Kartu nama dengan sayang mudah hanya dengan menggunakan Tabel saja. oke sebelum kita masuk ke pembahasan cara membuat kartu nama dengan dengan tabel, alangkah baiknya kalian baca terlebih dahulu artikel dibawah ini.
Baca Juga :
Setelah kalian membaca artikel tersebut, pastinya kalian akan memahami source code, dan cara yang sata buat, cara ini cukup simpel sekali, saya cuman menggunakan beberapa style css sebagai pemanis, selebihnya saya banyak menggunakan gambar.
Dan berikut tampilan yang sudah saya buat
Keren bukan.?, Lalu bagaimana cara membuat gambar tersebut menjadi timbul.?
Baca Juga :
tanpa perlu basa-basi lagi, langsung saja kita mulia tutorialnya.
1). Buat folder dengan nama bebas, misalkan NamaKu
2). Setelah itu buka sublime text 3, kemudian buka folder yang sudah kalian buat
3). Buat file dengan nama index.html, kenapa kok index.html.? kok bukan yang lain, karena nama index.html akan dibaca terlebih dahulu oleh google daripada file-file yang lain, makanya, buat kalian yang baru menginjak ke bahasa pemrograman web, biasakan file utama beri nama index.html
4). Kemudian copy source code dibawah ini
Bagaimana.? sangat mudah bukan.? buat kalian yang masih belum faham, silahkan sesi pertanyaan terbuka lebar buat kalian yang ingin bertanya-tanya.
Cara Membuat Kartu Nama dengan Tabel Keren |
Baca Juga :
Setelah kalian membaca artikel tersebut, pastinya kalian akan memahami source code, dan cara yang sata buat, cara ini cukup simpel sekali, saya cuman menggunakan beberapa style css sebagai pemanis, selebihnya saya banyak menggunakan gambar.
Dan berikut tampilan yang sudah saya buat
Membuat Kartu Nama dengan Tabel Keren |
Keren bukan.?, Lalu bagaimana cara membuat gambar tersebut menjadi timbul.?
Baca Juga :
tanpa perlu basa-basi lagi, langsung saja kita mulia tutorialnya.
Membuat Kartu Nama dengan Tabel Keren
1). Buat folder dengan nama bebas, misalkan NamaKu
2). Setelah itu buka sublime text 3, kemudian buka folder yang sudah kalian buat
3). Buat file dengan nama index.html, kenapa kok index.html.? kok bukan yang lain, karena nama index.html akan dibaca terlebih dahulu oleh google daripada file-file yang lain, makanya, buat kalian yang baru menginjak ke bahasa pemrograman web, biasakan file utama beri nama index.html
4). Kemudian copy source code dibawah ini
<!DOCTYPE html>
<html>
<head>
<title>Kartu Nama</title>
<style type="text/css">
body {
font-family: Arial;
}
td {
padding: 10px;
}
table {
margin: auto;
margin-top: 90px;
}
</style>
</head>
<body bgcolor="#181a1c">
<table border="0" width="600" cellpadding="0" cellspacing="0">
<tr>
<th colspan="3"><img src="Header.png" width="100%"></th>
</tr>
<tr bgcolor="#e7e7e7">
<td width="150">Nama Lengkap</td>
<td width="250">Muhammad Tajuddin</td>
<td rowspan="4"><img src="FotoMu.jpg" width="200"></td>
</tr>
<tr bgcolor="#e7e7e7">
<td>Hobby</td>
<td>Ngoding, Al Banjari, Trip</td>
</tr>
<tr bgcolor="#e7e7e7">
<td>Pekerjaan</td>
<td>Programmer</td>
</tr>
<tr bgcolor="#e7e7e7">
<td>Lulusan</td>
<td>SMK Negeri 1 Kota Pasuruan</td>
</tr>
<tr bgcolor="#19bd9b">
<td colspan="3" align="center">Created By : <a href="https://www.duniaprogramming.net">Dunia Programming</a></td>
</tr>
</table>
</body>
</html>
Setelah source code dibawa ini kalian copy, silahkan buka file index.html kalian dan lihat hasilnya."Lho min, kok headernya tidak muncul min.?"Nah lihat baris berikut :
<tr>
<th colspan="3"><img src="Header.png" width="100%"></th>
</tr>
baris tersebut menjelaskan bahwa sistem memanggil gambar, bukan text, maka dari itu, sebelumnya kalian buat dulu headernya di photoshop dengan ukuran 600x100 pixel, untuk cara membuatnya bisa kalian baca tutorial yang sudah saya sebutkan diatas.Bagaimana.? sangat mudah bukan.? buat kalian yang masih belum faham, silahkan sesi pertanyaan terbuka lebar buat kalian yang ingin bertanya-tanya.
Post a Comment for "Cara Membuat Kartu Nama dengan Tabel Keren"
- Gunakan Kata-Kata Yang Sopan
- Dilarang Keras Menaruh Link Aktif Dibawah Postingan
- Dilarang Membuat SPAM
- Dilarang Saling Melecehkan Antar Sesama
- Dilarang Promosi Web/Blog/Obat-Obatan Atau Yang Lain