ATTRIBUTE HTML
<table>,<tr>,<th>,<td>
Penulisan Attribute HTML :
<nama_tag nama_attribute="isi_attribute">
ex:
<table width="400">
align = perataan(center, left, rigth)
ex: <table align="center"> (rata tengah)
width = lebar (satuan px/piksel/%)
ex : <table width="500px">
<table width="30%">
border=garis tepi (satuan piksel/px)
ex: <table border="5px">
MENGUBAH WARNA TABLE
<tr (spasi) bgcolor="red"> (dalam satu
baris)
<table bgcolor="red"> (semua bariss)
cellspacing = jarak gariss tepi dengan garis luar
ex: <table cellspacing="2">
cellpadding = jarak garis tepi dalam dengan teks
ex: <table cellpadding="2">
rowspan = menggabungkan baris
ex: <td rowspan="3">
colspan = menggabungkan kolom
eex: <td colspan="2">
target="_blank" = agar tampilan menjadi di new tab
title="Halaman percobaan" = untuk memunculkan
tulisan ketika di sorot
Jika ingin menambahkan gambar, pastikan gambar tersebut terletak folder
yang sama dengan file .html kalian
MEMBUAT
HYPERLINK/LINK
Tag anchor <a>.... </a>
Attribute tag anchor
Href = referensi (alamat web/nama file)
Ex: <a href=”index.html”>Home</a>
Target = membuka link di tab baru
Ex: <a target=”_blank”>Home</a>
Title= tooltip (muncul keterangan saat link di sorot)
Ex: <a title=”Halaman beranda”>Home</a>
<br>
<br>
<a href=”percobaan.html”>Pergi ke percobaan</a>
MENAMPILKAN GAMBAR
MENGGUNAKAN HTML
TAG IMAGE <img/>
Attribute tag image
Src= source (alamat gambar)
Titlr= tooltip muncul keterangan saat gambar di sorot
Height= tinggi
Width=lebar
Alt=ket pengganti gambar tidak berhasil di load
Ex:<img src=”mie ayam.jpg” title=”gambar mie ayam”
height=”300” width=”500” alt=”gambar mie ayam”/>
LANGKAH-LANGKAH MEMBUAT TABEL MENGGUNAKAN HTML
1.
Buka xampp
2.
Start Apache dan MySQL, seperti biasa
3.
Ketikan perintah berikut :
<html>
<head>
<TITLE>Latihan
Membuat Table</TITLE>
</head>
<body>
<table
background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW8gRKw2dWCMqtjI9j1K9TyCcnPsYeDqYiHOlIfjV_mGMertBnGGhbmFoGL0fbHIywZ_9DIRz7SfAHNjP3UM3XOjBWQb1djP_IBTWzuy-R8GC6TmR6e-6n4eshOyklVB12wys3VT_ZONw/s792/BSI.jpg"
cellspacing="5" align="center" width="500"
height="300" border="3">
<tr align="center" bgcolor="red">
<th rowspan="2">
NO</th>
<th
colspan="2">Nim</th>
<th>Nama</th>
<th>Kelas</th>
</tr>
<tr align="center" bgcolor="yellow">
<td>1.</td>
<td>12172150</td>
<td>Fuad</td>
<td>MI 12 2F</td>
</tr>
<tr align="center" bgcolor="green">
<td>2.</td>
<td>12345678</td>
<td>mbuh</td>
<td>123f21</td>
</tr>
</table>
<br><br>
<a
href="percobaan.html" title="Halaman
percobaan"target="_blank">Pergi Ke percobaan</a>
<br><br>
<a
href="percobaan.html" ><img
src="https://www.realmadrid.com/img/horizontal_940px/img_0272.jpg"
title="Model madil" height="170" width="300"
alt="Model madil"/></a>
</body>
</html>
4. Untuk keterangan kegunaan-kegunaan
script nya sudah saya tulis di atas
5. Tampilan dari script di atas
Tidak ada komentar:
Posting Komentar