Satır yüksekliği, bir metin satırının yüksekliğini belirten bir CSS özelliğidir. Genellikle metin satırları arasındaki baştaki veya dikey boşluğu ayarlamak için kullanılır. Satır yüksekliği özelliği birkaç farklı şekilde belirtilebilir:
line-height özelliği aşağıdaki değerlerden birini alabilir:
PROFESYONEL İPUCU: Figma’da çizgi yüksekliğini ayarlamaya çalışıyorsanız, belirgin bir çizgi yüksekliği özelliği olmadığına dikkat edin. Satır yüksekliğini değiştirmenin tek yolu yazı tipi boyutunu değiştirmektir.
- normal: Bu varsayılan değerdir.
Tarayıcı, yazı tipi boyutuna göre satır yüksekliğini hesaplayacaktır.
- uzunluk: px, pt, cm, vb. olarak sabit bir satır yüksekliği belirtir.
- %: Yazı tipi boyutuna göre satır yüksekliğini ayarlar. Yazı tipi boyutu 16 piksel ise, satır yüksekliğini %200 olarak ayarlamak satır yüksekliğini 32 piksel yapar.
- ilk: Bu özelliği varsayılan değerine ayarlar. Hat yüksekliği için varsayılan değer normaldir
- inherit: Bu özelliği üst öğesinden devralır.
Örneğin, sayfanızdaki tüm paragrafların satır yüksekliğini 20px olarak ayarlamak isterseniz, aşağıdaki CSS’yi kullanırsınız:
.myClass { satır yüksekliği: 20px; }
Bir elemanın satır yüksekliğini belirlemenin en yaygın yolu, uzunluk değerini kullanmaktır. Bu, px, pt, cm vb. gibi herhangi bir geçerli CSS uzunluk birimi olabilir. Örneğin, sayfanızdaki tüm paragrafların satır yüksekliğini 20px olarak ayarlamak isterseniz, aşağıdaki CSS’yi kullanırsınız:
.myClass { satır yüksekliği: 20px; }
Satır yüksekliğini, öğenin yazı tipi boyutunun yüzdesi olarak da ayarlayabilirsiniz. Örneğin, bir öğedeki metin satırlarının çift aralıklı olmasını istiyorsanız, satır yüksekliğini %200 olarak ayarlarsınız. Üç aralıklı olmasını istiyorsanız, bunu %300’e ayarlarsınız ve bu şekilde devam eder.
Çözüm: Figma’da Çizgi Yüksekliğini, Figma’nın Metin Ayarları Menüsündeki Çizgi Yüksekliği Özelliği altında Normal veya Uzunluk değerini kullanarak ayarlayabilirsiniz.