- Menggunakan Tag <P>
Tag P <P> berguna untuk membuat sebuah paragraph, tetapi sebelum juragan atau ndoro membaca lebih jauh, untuk awalnya saya sarankan membaca Tutorial HTML Fundamental I. Sebagai contoh silahkan perhatikan kode berikut ini :
<html>
<head>
<title>Contoh Paragraf</title>
</head>
<body>
Aku Lagi Buat Tutorial HTML<p>
Tutorial sedang dalam proses pembuatan menggunakan word prosesor<br>
dan akan di konversi kedalam pdf agar file tetap aman dan tidak rusak<br>
setelah itu akan didistribusikan dengan gratis dengan beberapa syarat<br>
dengan mencantumkan nama pembuat atau pendistribusi<br>
</body>
</html>
Setelah kode dibuat maka simpan dengan ekstensi htm/html di root webserver anda. Setelah disimpan silahkan buka IE atau Firefox anda dan ketikkan localhost/namafile.htm pada address bar browser yang anda gunakan dan silahkan lihat hasilnya, jika hasilnya seperti gambar di bawah ini berarti anda telah berhasil memasukkan kodenya.
Pada prinsipnya efek tag <p> ini hampir sama dengan efek 2 buah tag <br>. Didalam tag <p> ini anda juga bisa menyisipkan atribut align yang berguna untuk mengatur peletakan teks didalam masing-masing baris. Sebagai contoh, perhatikan kode berikut. Contoh ini sekaligus memberikan contoh penggunaan tag <p> sebagai pengakhir paragraf.
<html>- Penjelasan:
<head>
<title>Contoh Tag P dengan ALIGN</title>
</head>
<body>
Blogspot
<p align ="center">
Blogspot adalah sebuah website yang menyediakan hosting dan sub domain gratis<br>
Pemilik dari site tersebut adalah Google Corporation<br>
Google sendiri adalah sebuah Corporation yang bergerak dibidang IT dan Software<br>
</p>
Semarang, 2010
</body>
</html>
<p align ="center">
Digunakan untuk membuat teks atau paragraph ditampilkan ke tengah. Efek tag <p align ="center"> ini berakhir setelah tag </p> ditemukan. Dengan demikian tulisan
Semarang, 2010
tidak terkena efek penengahan karena diluar efek tag <p> dan </p>. Hasil dari penulisan kode palign.htm ditunjukkan pada gambar palign.htm dibawah ini.
- Menggunakan Tag Judul
HTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumennya. Tag-tag judul ini berupa :
<h1>............................</h1>
<h2>............................</h2>
<h3>............................</h3>
<h4>............................</h4>
<h5>............................</h5>
Contoh berikut ini memberikan gambaran penggunaan tag <h1> untuk membuat judul :
BlogspotAgar ditampilkan dalam ukuran font besar.
<html>
<head>
<title>Contoh Pengaturan Judul</title>
</head>
<body>
<h1>Blogspot</h1><p>
Blogspot adalah sebuah website yang menyediakan hosting dan sub domain gratis<br>
Pemilik dari site tersebut adalah Google Corporation<br>
Google sendiri adalah sebuah Corporation yang bergerak dibidang IT dan Software<br>
Semarang, 2010
</body>
</html>
Perhatikan bahwa baris :
<h1>Blogspot</h1><p>
Memberikan efek tulisan “Blogspot:” dengan ukuran besar.
Contoh berikut ini memberikan hasil penggunaan tag <h1> sampai <h6>
<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>
Sebagaimana telah dijelaskan pada halaman satu, bahwa kebanyakan tag memiliki atribut. Begitu pula dengan tag judul <h1>. Salah satu atribut yang bisa digunakan adalah Align, yang berfungsi untuk mengatur penempatan teks didalam baris. Salah satu nilai yang dapat diberikan ke Align adalah Center, yang berarti judul ditempatkan di tengah-tengah layar pada baris yang bersangkutan. Sebagai contoh, perhatikan kode berikut :
<H1 ALIGN = "CENTER>Tutorial HTML</h1>
Kode diatas akan membuat tulisan “Tutorial HTML” diletakkan di tengah-tengah baris.
Selain Center, nilai lain yang dapat diisikan ke Align yaitu Left, Right dan Justify.
Contoh Tag untuk baris :
<H1 ALIGN = "LEFT>PARAGRAPH LEFT</h1>
<H1 ALIGN = "RIGHT>PARAGRAPH RIGHT</h1>
<H1 ALIGN = "JUSTIFY>PARAGRAPH JUSTIFY</h1>
<H1 ALIGN = "CENTER>PARAGRAPH CENTER</h1>
Contoh implementasi untuk penggunaan tag ALIGN ditunjukkan seperti dibawah ini :
<html>
<head>
<title>Tag h1-h6</title>
</head>
<body>
<H1 ALIGN = "LEFT>PARAGRAPH LEFT</h1>
<H1 ALIGN = "RIGHT>PARAGRAPH RIGHT</h1>
<H1 ALIGN = "JUSTIFY>PARAGRAPH JUSTIFY</h1>
<H1 ALIGN = "CENTER>PARAGRAPH CENTER</h1>
</body>
</html>
Sekian dulu untuk Tutorial HTML Fundamental II, ketemu lagi di Tutorial yang lain InsyaAllah,atau silahkan baca Tutorial HTML Fundamental I untuk awalannya.
Happy Coding
Best Regards
0 comments:
Post a Comment