Rabu, 02 Oktober 2013

PI - WEB ( HTML )

A. Pengertian HTML (Hyper Text Markup Language)
HTML adalah sebuah pemograman yang digunakan untuk membuat sebuah halaman web untuk menulis kode HTML digunakan editor teks seperti notepad dan Font page. contoh kode HTML yang sangat sederhana

<html>
<head>
<title>selamat datang</title>
</head>
<body>
Selamat belajar HTML
</body>
</html>


  1. pasangan tag <html> dan </html> menandakan bahwa kode yang terdapat di dalamnya adalah kode HTML sehingga browser akan menerjemahkan sebagai dokumen HTML.
  2. Bagian yang terdapat dalam <html> dan </html> umumnya terbagi atas :
    a. Kepala, ditandai dengan pasangan tag <head> dan </head>
    b. Badan, ditandai dengan pasangan tag <body> dan </body>
  3. Pada bagian kepala, bisa ditentukan judul HTML judul ini ditulis dalam pasangan tag <title> dan </title> pada contoh diatas html adalah selamat datang. judul ini diterakan di bagian atas jendela browser.
B.Cara menuliskan tag
Nama tag ditulis didalam tanda < dan > antara nama tag dan tanda < ditulis tanpa spasi sama sekali. nama tag boleh ditulis dengan huruf kecil, huruf kapital, ataupun kombinasi antara huruf kecil dan huruf kapital dengan kata lain penulisan :
<html>
<HTML>
<htML>
dianggap sama. namun umumnya tag ditulis dengan huruf kecil saja atau huruf kapital saja.

C. Atribut dalam Tag
Bebebrapa tag mengandung atribut didalamnya.
contoh :
 <p align="center">

Pada contoh ini p adalah nama tag sedangkan ALIGN adalah nama atribut. pada umumnya atribut melibatkan nilai pada contoh diatas " center " adalah nilai pada atribut align

D. Komentar
Komentar adalah bagian kode html yang diabaikan oleh browser, kegunaan komnetar dalam kode html adalah sebagai kererangan. sebuah komentar diawalu dengan <!-- dan diakhiri dengan -> contoh :


<!-- file komentar html
dibuat pada tanggal 4 agustus 2002-->
<html>
<head>
<title>Komentar</title>
</head>
<body>
<!-- ini juga komentar -->
komentar anda
</body>
</html>

E. Tag <br>
Fungsi tag <br> adalah untuk membuat baris baru atau berpindah baris.
contoh :
<html>
<head>
<title> tag br </title>
</head>
<body>
Selamat belajar HTML <br>
semoga sukses
</body>
</html>

F. tag <p>
tag <p> digunakan unuk membuat paragraf. 
contoh :
<html>
<head>
<title>Contoh paragraf</title>
</head>
<body>
pesona taman hias<p>
membawa suatu pesona tersendiri<br>
warna-wanrni benua<br>
antara rupa corak daun<br>
</body>
</html>

didalam tag <p> bisa disertakan atribut align yang berguna untuk mengatur peletakan teks didalam masing-masing baris. salah satu nilai yang dapat diberikan pada ALIGN adalah center yang menempatkan teks berada ditengah-tengah layar pada baris yang bersangkutan. selain center nilai lain yang dapat diisikan pada ALIGN yaitu
a. left : mengatur teks rata kiri terhadap halaman
b. right : mengatur teks kanan terhadap halaman
c. justify : mengatur teks kiri dan kanan efeknya terlihat untuk teks yang sangat panjang.
contoh :
<html>
<head>
<title>Tag P dengan Algin</title>
</head>
<body>
Puisiku :
<p align="center">
matahariku mulai terbangun dari mimpi<br>
menyemburkan sinar yang hangat <br>
burung-burung berkicau<br>
mengucapkan selamat pagi<br>
</p>
yogyakarta,2002
</body>
</html>

G. Tag judul
HTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumen. tag-tag judul ini berupa :
-<h1> ... </h1>
-<h2> ... </h2>
-<h3> ... </h3>
-<h4> ... </h4>
-<h5> ... </h5>
-<h6> ... </h6>
contoh :
<html>
<head>
<title>Tag h1 - h6</title>
</head>
<body>
<h1>Tag H1</h1>
<h2>Tag h2</h2>
<h3>Tag h3</h3>
<h4>Tag h4</h4>
<h5>Tag h5</h5>
<h6>Tag h6</h6>
</body>
</html>

seperti halnya tag <p> tag judul atau heading ini juga memiliki atribut align. nilai yang dapat diberikan pada align adalah :
a. Left(default) mengatut teks rata kiri terhadap halaman
b. Right mengatur teks rata kanan terhadap halaman
c. Center menempatkan judul di tengah-tengah layar pada baris yang bersangkutan
d. Justify mengatur teks rata kiri dan rata kanan. efek nya terlihat untunk teks yang sangat panjang.
contoh :
<html>
<head>
<title>Atribut Align</title>
</head>
<body>
<h1 align="left"> Pesona taman hias </h1>
<h1 align="right"> Pesona Taman Hias </h1>
<h1 align="center"> Pesona Taman Hias </h1>
</body>
</html>

H. Tag <hr>
untuk mempercantik halaman, seringkali pembuat dokumen web menambahkan garis Horizontal. garis ini sebernarnya dapat dibuat dengan mudah yakni dengan menyertakan tag <hr>
contoh :
<html>
<head>
<title> Tag HR</title>
</head>
<Body>
<h2> Tanaman HIAS </H2>
<hr>
Algonema atau sri rejeki
<hr>
</body>
</html>

daftar atribut <hr>
  • Size : Menentukan ketebalan garis
  • Width : menentukan lebar garis
  • Align : menentukan peletakan teks dalam baris
  • Noshade : mengatur garis agar tidak disertai bayangan
Contoh penggunaan atribut size :
<html>
<head>
<title>Atribut HR</TITLE>
</head>
<body>
<h1> Pesona </h1>
<hr size="10">
Jln Solo KM 14<br>
Yogyakarta<br>
</body>
</html>

Contoh penggunaan atribut noshade :
<html>
<head>
<title>Atribut HR</title>
</head>
<body>
<h1>Pesona</h1>
<hr size="10" noshade>
Jl Solo km 14 <BR>
Yogyakarta <BR>
</body>
</html>

Tidak ada komentar:

Posting Komentar