CSS Büyük ve Küçük Harf Dönüştürme

Text-transform özellik metnin tümünü büyük ve küçük harf yapmak isteyebiliriz veya Her kelimenin ilk harfini büyük harfe dönüştürmek için kullanılır.


.buyuk_harf {
 text-transform: uppercase;
}

text-transform’un özelliğinin alabileceği değerler:

Metnimizi tümünü, büyük harfe çevirelim:

HTML:


<p class="test">Bu gün hava çok güzel</p>	

CSS:


.test{
    text-transform: uppercase;
}

ÇIKTI:

BU GÜN HAVA ÇOK GÜZEL

Bazı tarayıcılarda hata çıkarsa tarayıcı hangi dilde büyütme yapacağını bilsin. HTML başlangıç etiketinin dil ayarını "tr" olarak değiştirelim.


<html lang="en">   <--!yerine-->

<html lang="tr">   <--!yazın-->	


Metnimizi tümünü, küçük harfe çevirelim:

HTML:


<p class="test">BU GÜN HAVA ÇOK GÜZEL</p>	

CSS:


.test{
    text-transform: lowercase;
}

ÇIKTI:

bu gün hava çok güzel

Her kelimenin ilk harfi büyük harf yapalım:

HTML:


<p class="test">Bu gün hava çok güzel</p>	

CSS:


.test{
    text-transform: capitalize;
}

ÇIKTI:

Bu Gün Hava Çok Güzel

FATÄ°H BURHAN 06/10/2022

Çok teşekkürler. https://www.herseyilanimda.com/ ilan platformumda kayıt sayfasında ad soyad alanları üye olanlar küçük büyük harfe dikkat etmeden bilgilerini giriyordu. Bunları düzeltmek için hayli zahmetli oluyordu. Bundan sonra böyle bir sorun olmayacak. Bir de satır başlarında ve noktadan sonra büyük harfle başlama kodu var mı? Mesela bu mesaj alanı büyük harfle başlayabilir ve noktadan sonra büyük harfle devam edebilirdi.

yönetici 07/10/2022

Malsef yok bunu PHP dili ile yababilirsin.

ebru 10/10/2023

BU GÜN HAVA ÇOK GÜZEL bu şekilde olanı Bu Gün Hava Çok Güzel bu şekilde çevirmek için ne yapmalı diğer komutlar işlemiyor.

yönetici 14/10/2023

Kelimelerin ilk harfi büyük diğerlerin küçük olması için text-transform: capitalize; özelliği ver.
Lütfen konu haricinde soru sormayın cevaplanmayacaktır. Yorumunuz onaylandıktan sonra yayınlanacaktır. Lütfen Yukarıda ki mesajları okuyun tekrar aynı soruları sormayın.

4008

KATEGORÄ°
  • HTML
  • CSS
  • PHP
  • JQUERY
  • PHOTOSHOP
  • JavaScript
  • Web Dünyası
  • Linux
  • MÄ°THRÄ°L FRAMEWORK
  • Laravel
  • Git
  • React
POPÃœLER MAKALE
  • HTML LÄ°NK(BaÄŸlantı)EKLEME - LÄ°NK VERME
  • HTML YAZI VE RESÄ°M ORTALAMA
  • HTML RESME LÄ°NK VERME
  • HTML FORM OLUÅžTURMA
  • CSS YATAY MENÃœ YAPIMI
  • HTML RESÄ°M EKLEME
  • CSS (BOYUT) GENÄ°ÅžLÄ°K VE YÃœKSEKLÄ°K (Width-Height)
  • HTML DÄ°V ve SPAN NEDÄ°R?
  • HTML ARKAPLANA MÃœZÄ°K EKLEME
  • KALÄ°TE KAYBETMEDEN RESÄ°MLERÄ° BÃœYÃœTME
ETÄ°KET
WEBCEBİR © 2013 Tüm hakları saklıdır.