CSS vertical-align

vertical-align :

Metnin yatay olarak nasıl hizalanacağını belirler. Bir elementin içeriğinin dikey hizalaması için kullanılır.

Örnek

p {
             font-size: 30px;
}
   img.top {
             vertical-align: text-top;
}
   img.bottom {
             vertical-align: text-bottom;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
baseline Çerçevenin taban çizgisi ile ebeveyn çerçevenin taban çizgisi hizalanır. Eğer çerçevelerin taban çizgileri yoksa çerçevelerin alt sınırları hizalanır
length Elementin px,cm,pt,yüzdeli vs. değerler alabileceğini belirtir.
sub Çerçevenin taban çizgisi, ebeveyn çerçevenin alt indisi için uygun yüksekliğe düşürülür. (Bu değerin elemanın yazı tipi yüksekliği üzerinde bir etkisi yoktur.)
super Çerçevenin taban çizgisi, ebeveyn çerçevenin üst indisi için uygun yüksekliğe yükseltilir. (Bu değerin elemanın yazıtipi yüksekliği üzerinde bir etkisi yoktur.)
top Çerçevenin tepesi ile satır çerçevesinin tepesi hizalanır.
text-top Çerçevenin tepesi ile ebeveyn elemanın yazı tipinin tepesi hizalanır.
bottom Çerçevenin altı ile satır çerçevesinin altı hizalanır.
text-bottom Çerçevenin altı ile ebeveyn elemanın yazı tipinin altı hizalanır.
middle Çerçevenin düşeyde orta noktası ebeveyn çerçevenin taban çizgisinin yarım x-yüksekliği yukarısına hizalanır.
İnital
İnherit

Tarayıcı Desteği

1.0 1.0 4.0 1.0 4.0

CSS text-align-last

text-align-last :

metinin son satırını hizalamak için kullanılır.

Örnek

p {
  text-align: center;
  -moz-text-align-last: left; /* Code for Firefox */
   text-align-last: left;
}

Codepen Ön izleme

 

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
auto Metinin son satırını eşit genişliğe ayarlar ve sola hizalar.
left Metinin son satırını sola hizalar.
right Metinin son satırını sağa hizalar.
center Metinin son satırını ortalar.
justify Metinin son satır çizgilerini eşit genişliğe ayarlar.
İnital
İnherit

Tarayıcı Desteği

Desteklenmiyor. 5.5 12.0-moz Desteklenmiyor Desteklenmiyor

CSS text-align

text-align :

metin hizalaması için kullanılır.

Örnek

.sag{
  text-align: right; 
}
.sol {
  text-align: right;
}
.orta {
   text-align: center;
}

Codepen Ön izleme

Css Sözdizimi

Değer Açıklama
left Metni sola hizalar.
right Metni sağa hizalar.
center Metni ortalar.
justify Metindeki her satırı eşit genişliğe ayarlar.
İnital
İnherit

Tarayıcı Desteği

1.0 1.0 3.0 1.0 3.5