Kita akan coba menggunakan kode CSS untuk mengatur paragrap.
Property yang digunakan untuk mengatur paragrap yaitu :
1. text-indent (Mengatur Indentasi).
2. direction (Mengatur Arah Paragrap).
3. text-align (Mengatur Perataan).
CSS text-indent
Cara penulisan text-indent:
| p {text-indent: 1cm} |
untuk mengisi nilai (value) dari text-indent lihat pada bagian CSS Units.
<html> <style type="text/css"> p {text-indent: 1cm} </style> </head> <body> <p> Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm. </p> </body> </html> |
Tampilan pada browser:
Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.
Property direction mempunyai 2 macam nilai(value) yaitu:
1. ltr (left to right)
2. rtl (right to left)
Value ltr adalah default, sedang value rtl biasa digunakan kalau kita membuat paragrap dengan arah dari kanan ke kiri, seperti yang digunakan pada tulisan arab.
Cara penulisan direction:
| p {direction: rtl} |
Contoh paragrap pada text-indent, kalau kita tambahkan property direction:rtl, maka akan tampak pada browser:
Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm. Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.Ini adalah contoh paragrap dengan inden 1 cm.
CSS text-align
CSS dapat mengatur perataan text dengan propperty text-align. Property ini mempunyai 4 macam nilai (value) yaotu:
1. left (Paragrap/Text rata kiri) (default)
2. right (Paragrap rata kanan)
3. center (Paragrap rata tengah)
4. justify (Paragrap rata kiri kanan)
Cara penulisan text-align:
| p {text-align: right} |
Contoh Penggunaan
<html> <style type="text/css"> h1 {text-align: center} h2 {text-align: left} h3 {text-align: right} </style> </head> <body> <h1>Header 1 rata tengah</h1> <h2>Header 2 rata kiri</h2> <h3>Header 3 rata kanan</h3> </body> </html> |
|
kalo' ngatur jarak antara paragrap yang atas sama yang bawah pake' yang mana satu...? mas atw Mbak nihh? mohon jawabannya..
ReplyDelete