CSS Metin Hizalama
Metin hizalama
Özellik text-align
, bir metnin yatay hizalamasını ayarlamak için kullanılır.
Bir metin sola veya sağa hizalanmış, ortalanmış veya iki yana yaslanmış olabilir.
Aşağıdaki örnek, ortaya hizalanmış ve sola ve sağa hizalanmış metni gösterir (metin yönü soldan sağa ise sola hizalama varsayılandır ve metin yönü sağdan sola ise sağa hizalama varsayılandır):
Örnek
h1 {
text-align: center;
}
h2 {
text-align: left;
}
h3 {
text-align: right;
}
Özellik "yasla" olarak ayarlandığında text-align
, her satır eşit genişliğe sahip olacak ve sol ve sağ kenar boşlukları düz olacak şekilde gerilir (dergi ve gazetelerde olduğu gibi):
Örnek
div {
text-align: justify;
}
Metni Son Hizala
Özellik text-align-last
, bir metnin son satırının nasıl hizalanacağını belirtir.
Örnek
Metnin son satırını üç <p> öğesiyle hizalayın:
p.a
{
text-align-last: right;
}
p.b
{
text-align-last: center;
}
p.c
{
text-align-last: justify;
}
Metin yönü
ve özellikleri direction
,
unicode-bidi
bir öğenin metin yönünü değiştirmek için kullanılabilir:
Örnek
p {
direction: rtl;
unicode-bidi: bidi-override;
}
Dikey hizalama
Özellik vertical-align
, bir öğenin dikey hizalamasını ayarlar.
Örnek
Bir metindeki görüntünün dikey hizalamasını ayarlayın:
img.a {
vertical-align: baseline;
}
img.b {
vertical-align: text-top;
}
img.c {
vertical-align:
text-bottom;
}
img.d {
vertical-align: sub;
}
img.e {
vertical-align: super;
}