Mengatur Warna Teks
Untuk mengatur warna teks, kamu bisa menggunakan properti color.
<p style="color:blue">Teks warna biru</p>
|
Membuat Paragraf Menjorok ke dalam
Membuat baris pertama pada sebuah paragraf menjadi menjorok ke dalam. Menggunakantext-indent, isikan jaraknya dari samping kiri anda dalam ukuram px (pixel) atau em.
<p style="text-indent: 30px">Ini
paragraf contoh paragraf menjorok ke dalam di atur dengan CSS. contoh
paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf
contoh paragraf contoh paragraf</p>
|
Mengatur Jarak Antar Huruf
Menggunakan properti letter-spacing, isikan jarak dalam ukuran px (pixel) atau em. Jika jaraknya negatif maka teks akan saling bertumpukan.
<h1 style="letter-spacing: 18px">Contoh Heading yang diatur dengan CSS</h1>
|
Mengatur Jarak Antar Baris
Menggunakan propertiline-height, isikan jarak antar baris dalam ukuran px (pixel) atau em. Nilai minimum adalah nol, jika jarak line-height-nya diisi nol maka paragraf akan tampil bertumpukan menjadi satu baris. dan jika isinya negatif maka tidak akan berpengaruh.
<p>Ini paragraf standar</p>
<p style="line-height: 34px;">Ini paragraf dengan teks yang di atur dengan CSS. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="line-height: 34px;">Ini paragraf dengan teks yang di atur dengan CSS. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
|
Mengatur Align Teks
Menggunakan properti text-align, kamu mengisinya denganleft (rata kiri), right (rata kanan), center (rata tengah), dan justify (rata kanan-kiri)
<p>Ini paragraf standar, secara default align-nya left (rata kiri)</p>
<p style="text-align:right">Ini paragraf dengan teks rata kanan. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="text-align:center">Ini paragraf dengan teks rata tengah. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="text-align:justify">Ini paragraf dengan teks rata kanan-kiri. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="text-align:right">Ini paragraf dengan teks rata kanan. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="text-align:center">Ini paragraf dengan teks rata tengah. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
<p style="text-align:justify">Ini paragraf dengan teks rata kanan-kiri. contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf contoh paragraf</p>
|
Simak contoh berikut untuk menambah pemahaman kamu:Contoh Penataan Teks dengan CSS
<!doctype
html>
<html>
<head>
<title>Contoh Penataan Teks dengan CSS</title>
</head>
<body>
<h1>Contoh penataan Teks dengan CSS</h1>
<p>Ini paragraf dengan teks standar.</p>
<p style="text-indent: 30px; line-height: 24px; letter-spacing: 5px;
text-align: justify;">Ini paragraf dengan teks yang di atur dengan
CSS. contoh paragraf contoh paragraf contoh paragraf contoh paragraf
contoh paragraf contoh paragraf contoh paragraf</p>
<h1 style="letter-spacing: -8px; font-size: 40px; font-weight:
normal; color: rgba(0, 122, 255, 0.5); font-family: verdana;">Contoh
Heading yang diatur dengan CSS</h1>
</body>
</html>
No comments:
Post a Comment