Thursday, 7 January 2016

Belajar Dasar HTML (Text Alignment)



Text Alignment

    Dalam pembuatan dokumen HTML,kita dapat menentukan letak dari teks atau gambar yang terdapat pada halaman web apakah kita ingin rata kiri. Rata kanan, rata kiri – kanan atau rata tengah (berada di tengah – tegah layar). Untuk melakukan hal ini, kita dapat mengisi atribut ALIGN dengan nilai – nilai berikut :

Nilai atribut ALIGN
Keterangan
Left
Menentukan teks rata kiri
Right
Menentukan teks rata kanan
Justify
Menentukan teks rata kiri - kanan
Center
Menentukan teks agar berada di tengah – tengah layar (secara horizontal)
 
      Atribut ALIGN dapat disisipkan ke dalam tag – tag yang akan diatur posisi teksnya. Sebagai contoh , ALIGN dapat disisipkan ke dalam tag <h>, yang berarti kita akan mengatur posisi dari suatu judul. Begitu juga jika ingin mengatur posisi teks dalam suatu paragraf maka kita perlu menyisipkan atribut ALIGN ke dalam tag <p>. berikut ini adalah contoh kode yang akan menunjukkan cara mengatur posisi teks dalam dokumen HTML.

  1. Bukalah text Editor kalian (Notepad, Notepad ++ atau lainnya)
  2. Disini saya menggunakan Notepad ++ 
  3. Ketikkan atau salinlah kode di bawah ini  


<html>
<head>
      <title>Text Alignment </title>
</head>
<body>
       <h3 align="center"> Contoh Text Alignment </h3>
               
<p> Ini adalah contoh text yang secara default akan dianggap sebagai rata kiri. Karena HTML  akan menganggap nilai atribut ALIGN  yang tidak dituliskan secara eksplisit dengan nilai LEFT. </p>

<p align="right">  Ini adalah contoh teks yang diatur agar rata kanan. Teks seperti ini jarang di gunakan atau jarang di jumpai dalam dokumen - dokumen HTML. </p>

<p align="justify"> Ini adalah teks yang diatur dengan format rata kanan - kiri. Yaitu dengan memasukkan nilai justify pada atribut ALIGN. Teks dengan format seperti ini sangat cocok sekali digunakan untuk dokumen HTML yang sifatnya formal. </p>

<p align="center">Ini adalah teks yang diatur dengan format CENTER. Dengan meilih format ini, teks akan berada tepat di tengah - tengah layar browser (Secara Horizontal).  </p>

</body>
</html>
  

    4. Lalu simpalah dengan nama textalignment.html
    5. Lalu bukalah dengan aplikasi browser kalian

Text Alignment
Setelah Selesai dengan benar, maka tampilannya akan sama seperti gambar diatas.


 

Silahkan Gabung di Page Facebook kami Harbert Share


Lorem ipsum is simply dummy text of the printing and typesetting industry.


EmoticonEmoticon