CSS’de “text” ile ilgili özellikler oldukça fazladır. Bu özellikler, belirli bir metin öğesi veya içeriğiyle ilgili görüntüleme ayarlarını belirlemek için kullanılır.
Bu özellikler, yazı tipi, yazı rengi, yazı boyutu, satır aralığı gibi birçok seçenek içerir. Bu ders boyunca, “text” ile ilgili en yaygın kullanılan özellikleri ve nasıl kullanılacağını ele alacağız.
Yazı Tipi Özelliği
“font-family” özelliği, metnin yazı tipini belirlemek için kullanılır. Bu özellik, herhangi bir web yazı tipi yüzeyini seçmenizi sağlar. Aşağıdaki örnekte, “font-family” özelliği “Arial” olarak ayarlanmıştır.
p {
font-family: Arial;
}Yazı Rengi Özelliği
“text-color” özelliği, metnin yazı rengini belirlemek için kullanılır. Bu özellik, “red”, “# 000000”, “rgb (255, 0, 0)” gibi birçok renk değerini destekler. Aşağıdaki örnekte, “text-color” özelliği “siyah” olarak ayarlanmıştır.
p {
color: black;
}Yazı Boyutu Özelliği
“font-size” özelliği, metnin yazı boyutunu belirlemek için kullanılır. Bu özellik, herhangi bir piksel veya yüzde değeriyle ayarlanabilir. Aşağıdaki örnekte, “font-size” özelliği “14 piksel” olarak ayarlanmıştır.
p {
font-size: 14px;
}Satır Aralığı Özelliği
“line-height” özelliği, metnin satır aralığını belirlemek için kullanılır. Bu özellik, herhangi bir piksel veya yüzde değeriyle ayarlanabilir. Aşağıdaki örnekte, “line-height” özelliği “1.5” olarak ayarlanmıştır.
p {
line-height: 1.5;
}Yazı Kalınlığı Özelliği
“font-weight” özelliği, metnin yazı kalınlığını belirlemek için kullanılır. Bu özellik, “normal”, “bold”, “bolder”, “lighter” veya “100” ile “900” arasında herhangi bir sayı değeriyle ayarlanabilir. Aşağıdaki örnekte, “font-weight” özelliği “bold” olarak ayarlanmıştır.
p {
font-weight: bold;
}Yatay Hizalama Özelliği
“text-align” özelliği, metnin yatay hizalamasını belirlemek için kullanılır. Bu özellik, “left”, “right”, “center” veya “justified” gibi seçenekler içerir. Aşağıdaki örnekte, “text-align” özelliği “center” olarak ayarlanmıştır.
p {
text-align: center;
}Metin Arka Plan Rengi Özelliği
“background-color” özelliği, metnin arka plan rengini belirlemek için kullanılır. Bu özellik, “red”, “# 000000”, “rgb (255, 0, 0)” gibi birçok renk değerini destekler. Aşağıdaki örnekte, “background-color” özelliği “gri” olarak ayarlanmıştır.
p {
background-color: gray;
}Bu özellikler, metnin görüntüsünü belirlemek için kullanılan en yaygın “text” özellikleridir.
