Pelajaran HTML Part 1



Pengenalan HTML
Hypertext Markup Language merupakan standard bahasa yang di gunakan untuk menampilkan document web, yang bisa anda lakukan:
·         Mengontrol tampilan dari web page dan contentnya.
·         Mempublikasikan document secara online sehingga bisa di akses
·         Membuat online form yang bisa di gunakan untuk menangani pendaftaran, transaksi secara online.
·         Menambahkan object-object seperti image, audio, video dan juga java applet dalam document HTML.

Pengantar HTML

Tag
Fungsi Tag / Lokasi Tag
<html>,</html>
Diawal code dan diakir (Start dan Stop)
<head> , </head>
Letakkan<title>dan </title> disekitarnya.
<title> , </title>
Letakkan Judul/Teks disekitarnya
<body> , </body>
Setelah metelakkan </title> dan </head> telakkan <body> dan </body>
 
Contoh (first.html) :
<HTML>
<HEAD>
<TITLE> First HTML Document</TITLE>
</HEAD>
<BODY>
   Belajar Web Desain
</BODY>
</HTML>

Atau pengetikannya bisa juga di buat dalam 1 baris atau lebih:
<HTML><HEAD><TITLE> First HTML Document</TITLE></HEAD>
<BODY>Belajar Web Desain</BODY></HTML>

Tag
Fungsi Tag / Lokasi Tag
<h1>,</h1> - <h2>,</h2>... <h6>,</h6>
Membuat tulisan dengan format header .
<b>,</b>
Tulisan Bold.
<i>,</i>
Tulisan Italic.
<p>,</p>
Tulisan Paragrap-break
<br>
Membuat Baris Baru (Break)
<hr>
Membuat Garis Horizontal
<a>,</a>
Membuat hyperteks link.
<img src=”file”>
Meletakkan gambar

Format Image, Ada banyak format image, tapi ada tiga jenis format yang paling sering digunakan :
1.    GIF (Graphical Interchange Format) (.GIF)
2.    JPEG (Joint Photographic Expert Image) (.JPG)
3.    PNG (Portable Network Graphics) (.PNG)
Contoh (first-new.html) :
<HTML>
<HEAD>
<TITLE> First HTML Document</TITLE>
</HEAD>
<BODY bgcolor="#00AAFF">
    <H1>Belajar Web Desain</H1>
    Tulisan: <B>Tebal</B> dan <I>Miring</I>
    <P><U>Paragraph Baru</U>
    <P>Klik <A HREF="www.yahoo.com">disini</A><BR>
    <IMG SRC="logo.gif" ALT="Gambar Logo">
</BODY>
</HTML>

Tag
Fungsi Tag / Lokasi Tag
<table border=1>, </table>
Memulai tabel dengan tebal border/garis=1 dan mengakhiri table
<th>,</th>
Membuat baris header pada table
<tr>,</tr>
Membuat baris pada table (tr=table row)
<td>,</tr>
Membuat kolom/sel (td=table cell)
<td colspan=2>
Menggabungkan/merge 2 kolom
<td rowspan=2>
Menggabungkan/merge 2 baris
width dan height
Lebar dan Tinggi sel atau tabel (satuan % atau px)



Contoh (tabel.html) :
<TABLE border="1" width="300">
  <TR>
        <TH>Nama Barang</TH>
        <TH>Harga</TH>
  </TR>
  <TR>
        <TD>Komputer</TD>
        <TD align="right">1000000</TD>
  </TR>
  <TR>
        <TD>Printer</TD>
        <TD align="right">500000</TD>
  </TR>
  <TR>
        <TD colspan="2" align="center">Total : 1500000</TD>
  </TR>
</TABLE>

Tidak ada komentar:

Posting Komentar

Pages