html lanjut - StaffSite Pradnya Paramita

Download Report

Transcript html lanjut - StaffSite Pradnya Paramita

HTML LANJUT
FONTASI
Fontasi = modifikasi font
 Tag <font> </font>
 Atribut tag font


Contoh penggunaanya : kita demokan
FONTASI
(Phyisical
Formating)
Tag
Deskripsi
(Logical formating)
Tag
Deskripsi
<b>..</b>
Bold Text
<strong>…</strong>
Bold Text
<i>..</i>
Italic text
<em>…<em>
Italic text
<u>..</u>
Underline Text
<ins>…</ins>
Underline Text
<strike>…</strike>
Garis tengah
pada text
<del>..</del>
Garis tengah
pada text
IMAGE (PENYISIPAN CITRA)
Ada beberapa hal yang perlu diperhatikan dalam
penyisipan citra atau gambar ke page, yakni :
1. Ukuran file citra
2. Tipe file citra

IMAGE (PENYISIPAN CITRA)
File citra dapat disisipkan ke dalam suatu file HTML
dengan menggunakan tag <IMG>, yakni dalam
 format penuh:
<IMG SRC="URL" ALT="deskripsi teks" ALIGN="Arah">

HYPERLINK
HYPERLINK
Link bisa merupakan suatu text atau gambar
 Pembuatan link dalam suatu file HTML dapat dilakukan
dengan menggunakan tag <A>
 Dua atribut yang sering dipakai pada tag ini adalah href
dan target
 Contoh penggunaanya:
<A HREF=http://www.yahoo.com/Home/homepage.html>
Klik di sini </A>
 <A HAREF = “Tujuan”> <IMG SRC = “nama file
gambar.ekstensinya”></A>

HYPERLINK
Macam –macam LINK :
1.
Link Relatif : Link page lain pada computer yang sama
 Contoh : <a href = “file2.html”> berikutnya </a>
2. Link absolute : link web lain di internet
Contoh : <a href = “http:// www.google.com”>google</a>
3. Link ke bagian lain dalam dokumen : Link ke bagian lain
dalam page yang sama
Contoh : <A href = “#nama bagian ”> bagian lain</a>
4. Membuka Link untuk Window Baru
 <a href = “ http :// www.google.com ” target = “_blank”>Google
</a>
5. Keluar dari suatu Frame
 <a href = “ http :// www.google.com ” target = “_top”>Google
</a>
6. Mailto
 <a href = “ mailto : [email protected]>kirim email </a>

TABEL

Untuk menambahkan sebuah table yang baris dan kolomnya dapat
anda sesuaikan kebutuhan table yang anda buat. Elemen table
terdiri dari <tr>, <td> dan <th>. Dimana fungsi masing – masing
berbeda, <tr> digunakan untuk membuat baris, <th> untuk
membuat header, <td> digunakan untuk membuat kolom
<table>
Width=“…”
Mengatur lebar dari tabel
Border=“…”
Mengatur ukuran bingkai
Cellspasing=“…”
Mengatur jarak antar sel
Cellpadding=“…”
Mengatur jarak bingkai dengan isi
Align=“..”
Mengatur perataan
Bgcolor=“…”
Mengatur warna dasar tabel
Bordercolor=“…”
Mengatur warna bingkai tabel
<TR>
Align=“…”
Mengatur perataan isi sel
Valign=“…”
Mengatur perataan secara vertikal
Bgolor=“…”
Mengatur warna dasar dari sel
<TD>
Rowspan = “…”
Menggabungkan beberapa baris
menjadi satu
Colspan=“….”
Menggabungkan beberapa kolom
menjadi satu
TUGAS