Blog e arek Mblitar..
ISLAM CORNER | HANDPHONE | WINDOWS TRICK | SEO | SOFTWARE | VIRUS | ISENG | CBOX TRICK | CSS TUTORIAL | HACKING | BLOGGING TIPS | INTERNET | HTML TUTORIAL |

Tutorial CSS PARAGRAPH

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.
Contoh Penggunaan
<html>
<head>
<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.
CSS Direction
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>
<head>
<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>





Header 1 rata tengah

Header 2 rata kiri

Header 3 rata kanan


0 comments:

TULIS KOMENTAR ANDA..!!

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Powered by Blogger