Pelajari cara menggunakan properti garis gaya CSS untuk memengaruhi jarak baris Anda di halaman Web Anda.
Nilai Spasi Garis CSS
Jarak baris CSS dipengaruhi oleh tinggi baris properti gaya CSS. Properti ini membutuhkan hingga 5 nilai yang berbeda:
- Normal: browser menentukan nilai untuk spasi baris yang terkait dengan ukuran font. Ini biasanya sama dengan ukuran font atau sedikit lebih besar (seperti 20%).
- Mewarisi: spasi baris harus diambil dari spasi baris elemen induk. Jadi jika Anda menetapkan tinggi garis dari tag badan Anda hingga 30% lebih besar dari ukuran font dan tag paragraf di dalamnya yang ditetapkan untuk diwariskan, mereka juga akan memiliki tinggi garis 30% lebih besar dari ukuran font.
- Sebuah angka: Jika nilai garis-tinggi tidak memiliki satuan ukuran, itu dianggap sebagai pengali pada ukuran font untuk tinggi garis. Jadi, tinggi garis 1,25 akan 25% lebih besar dari ukuran font.
- A Length: Jika nilai garis-tinggi memiliki satuan ukuran, itu adalah jumlah ruang yang tepat harus ada di antara garis. Jadi, 1,25 mm akan menghasilkan garis 1,25 milimeter terpisah.
- Persentase: Jika garis-tinggi adalah persentase, itu akan menjadi persentase dari ukuran font. Jadi, tinggi garis 125% akan menjadi 25% lebih besar dari ukuran font.
Nilai mana yang harus Anda gunakan untuk spasi garis CSS
Dalam banyak kasus, pilihan terbaik untuk spasi baris adalah membiarkannya di default atau "normal." Ini umumnya yang paling mudah dibaca dan tidak mengharuskan Anda melakukan sesuatu yang istimewa. Namun mengubah spasi baris dapat memberi nuansa berbeda pada teks Anda.
Jika ukuran font Anda didefinisikan sebagai ems atau persentase, tinggi garis Anda juga harus ditentukan dengan cara itu. Ini adalah bentuk spasi baris yang paling fleksibel karena memungkinkan pembaca untuk mengubah ukuran font dan menjaga rasio yang sama pada spasi baris Anda.
Setel tinggi baris untuk lembar gaya cetak dengan nilai titik (pt). Intinya adalah ukuran cetak, dan ukuran font Anda harus dalam poin juga.
Kami tidak suka menggunakan pilihan nomor karena kami menemukan bahwa itu sangat membingungkan orang. Banyak orang berpikir bahwa jumlahnya adalah ukuran yang mutlak, sehingga mereka membuatnya besar. Misalnya, Anda mungkin memiliki satu set font di 14px dan kemudian Anda mengatur tinggi-baris Anda ke 14 yang menghasilkan kesenjangan besar antara garis karena jarak garis diatur ke 14 waktu ukuran font.
Berapa Banyak Ruang Yang Harus Anda Gunakan untuk Spasi Baris Anda
Seperti yang disebutkan di atas, kami menyarankan untuk menggunakan spasi baris default kecuali Anda memiliki alasan khusus untuk mengubahnya. Mengubah spasi baris dapat memiliki efek yang berbeda:
- Teks yang sangat rapat bisa sulit dibaca. Tetapi ruang garis kecil dapat mempengaruhi mood teks. Jika teks diringkas bersama, itu bisa membuat kesan teks tampak lebih gelap atau lebih padat.
- Teks yang lebih jauh terpisah juga bisa sulit dibaca. Namun ruang garis yang lebar membuat teks tampak lebih mengalir dan lancar.
- Mengubah spasi baris dapat membuat teks yang tidak cocok dengan ruang menjadi lebih padat atau mengambil lebih banyak ruang di desain Anda.
