Header Ads

Belajar HTML Dasar Part 2 : Membuat tabel dan gambar

selasa 25 oktober 2016

Assalamaualaiakaum wr.wb.

kemarin saya telah posting tentang struktur html dasar klik disini
kali ini saya akan memposting tentang struktur html :
  1. membuat tabel.
  2. memasukan gambar di html.
pertama kita akan membuat sebuah tabel di HTML .
buka notepad /gedit.

ketik di bawah ini :

<!DOCTYPE html>
<html>
<head>
    <title>cara membuat tabel</title>
</head>
<body>
<table border="1" width="70%">
    <tr>
        <td>nis</td>
        <td>nama</td>
        <td>kelas</td>
        <td>sekolah</td>
    </tr>
    <tr>
        <td>12345</td>
        <td>Bima Zainudin Ikhsan</td>
        <td>XI RPL 1</td>
        <td>SMK 1 Mejayan</td>
    </tr>
</table>
</body>
</html>
dan caranya save cara mudah Ctrl + S dan nama foldernya di ganti dengan tabel.html .

jika di tampilkan di web browser maka tampilanya seperti di bawah ini :


 keterangan :
  • <table>...</table> : bertujuan untuk membuat tabel.<table> :sebagai awalan membuat dan </table> :sebagai penutup tabel.
  • <tr>...</tr>             : bertujuan untuk membuat baris pada tabel.
  • <td>...</td>          : bertujuan untuk membuat sebuah kolom di dalam tabel.
  •  border="1"            : untuk memberikan atau mempertebal garis tepi atau frame di dalam tabel ,jika border="1" tidak di ketik maka tidak akan muncul frame .
  • width="70%"          : untuk melebarkan sebual tabel,bisa menggunakan % dan px (pixel) dari web browser kalian. 
jika ingin lebih lengkapnya kunjungi http://w3school.com .

____________________________________________________________________________________

jika sudah membuat tabel dan sekarang saya ingin menjelaskan cara memasukan gambar ke dalam web browser kalian.

ini scripnya :

<!DOCTYPE html>
<html>
<head>
    <title>cara memmasukan gambar</title>
</head>
<body>
<img src="smartit.png">
</body>
</html>
dan ini hasilnya :


keterangan :
  • <img src="smartit.png"> : di gunakan untuk memasukan gambar .
  • src=""                                   : lokasi penyimpanan .
  • smartit.png                     : nama file gambar yang ingin di masukan ke web browser dan sekaligus format filenya.
catatan ???

jika ingin memasukan gambar seharusnya file di jadikan satu sama file HTMLnya, jika tidak maka file nya bisa-bisa error .
sekian postingan saya jika ada errornya atau kurang paham silahkan mengisi komentar yang ada di bawah ini ,jangan malu bertanya nanti sesat di jalan .

waasalamualaiakaum wr.wb

No comments

Powered by Blogger.