Mengatur jarak Baris menggunakan CSS

July 22, 2018
Di sini kita akan mempelajari bagaimana mengatur jarak baris dalam suatu paragraf.
Berikut ini adalah nama properti nya
line-height : size;

dengan size diisi angka yang menyatakan ukuran disertai satuannya. 
Contoh:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>CSS Guide</title> 
<style type="text/css"> 
p.styled { 
 line-height: 30px; 
 } 
 
</style> 
</head> 
<body> 
<p class="styled">Ini adalah paragraf 1. Ini adalah paragraf 1. Ini 
adalah paragraf 1. Ini adalah paragraf 1. Ini adalah paragraf 1. Ini 
adalah paragraf 1. Ini adalah paragraf 1. Ini adalah paragraf 1. Ini 
adalah paragraf 1. Ini adalah paragraf 1. </p> 
<p>Ini adalah paragraf 2. Ini adalah paragraf 2. Ini adalah paragraf 2. 
Ini adalah paragraf 2. Ini adalah paragraf 2. Ini adalah paragraf 2. 
Ini adalah paragraf 2. Ini adalah paragraf 2. Ini adalah paragraf 2. 
Ini adalah paragraf 2. Ini adalah paragraf 2. </p> 
</body> 
</html>

Paragraf pertama diberikan style untuk mengatur jarak antar baris sebesar 30 pixel, sedangkan paragraf kedua memiliki jarak baris default. Perhatikan perbedaannya pada tampilan berikut ini

Setelah ini kita akan pelajari bagaimana merubah warna teks.
Untuk melihat artikel/materi lainnya silahkan masuk di sini

Wickey

Author:

Facebook Comment

Inside Post