Anasayfa

Html & Css

Html Css Text-Align Komutu Kullanımı
Facebookta Paylaş

Html Css Text-Align Komutu Kullanımı

Bu dersimizde Html ve Css 'de text-align komutunun kullanımını gösteriyor olacağım. Text-align komutu içeriğin hizalanmasını belirlerken kullandığımız bir komuttur. Text-align komutu , rightleftcenter ve justify parametlerini almaktadır.  Şimdi örnekler üzerinden gidelim ve nasıl kullanıldığını görelim.

210 px genişliğinde bir span içerisinde bir yazı girelim. Kodumuz şöyle olacaktır;

<span style="width:210px;display:block;">Html ve css ile text-align komutunun kullanımı ve örnekleri</span>

Yukarıdaki kodu hiç text-align uygulamadan yazdığımızda aşağıdaki gibi görünecektir.

Html ve css ile text-align komutunun kullanımı ve örnekleri

Text-align:left uygulanmış hali için kodumuz aşağıdaki gibi olacaktır.Sola hizalama yapacağından görünüm değişmeyecektir.

<span style="width:210px;display:block;text-align:left;">Html ve css ile text-align komutunun kullanımı ve örnekleri</span>

text-align:left; yazdığımızda aşağıdaki gibi görünecektir.

Html ve css ile text-align komutunun kullanımı ve örnekleri

Text-align:right uygulanmış hali için kodumuz aşağıdaki gibi olacaktır.Yazıyı sağa hizalama yapacaktır.

<span style="width:210px;display:block;text-align:right;">Html ve css ile text-align komutunun kullanımı ve örnekleri</span>

text-align:right; yazdığımızda aşağıdaki gibi görünecektir.

Html ve css ile text-align komutunun kullanımı ve örnekleri

Text-align:center uygulanmış hali için kodumuz aşağıdaki gibi olacaktır.Yazıyı ortalayacaktır.

<span style="width:210px;display:block;text-align:center;">Html ve css ile text-align komutunun kullanımı ve örnekleri</span>

text-align:center; yazdığımızda aşağıdaki gibi görünecektir.

Html ve css ile text-align komutunun kullanımı ve örnekleri

Text-align:justify uygulanmış hali için kodumuz aşağıdaki gibi olacaktır.Yazının tamamlanan satırını genişliğe sığdıracaktır.

<span style="width:210px;display:block;text-align:justify;">Html ve css ile text-align komutunun kullanımı ve örnekleri</span>

text-align:justify; yazdığımızda aşağıdaki gibi görünecektir.

Html ve css ile text-align komutunun kullanımı ve örnekleri

 

24 Ekim 2013 12:08 Kategori :Html & Css11955
Sitene Ekle :
Yukarıdaki kodu sitenize ekleyerek bu konuyu sitenizde yayınlayabilirsiniz.