css text-transform, metnin büyük-küçük harf olarak belirlemek için kullanılır. Bu özellik çok kullandığımız bir özelliktir.
Aldığı parametreler:
none : Herhangi bir değişiklik yapmaz. Metin yazıldığı kalır.
capitalize : Kelimelerin ilk harfini büyük yapar
uppercase : Bütün harfleri büyük yapar.
lowercase : Bütün harfleri küçük yapar.
inherit : Bir üstteki elementten miras alır.
initial : Varsayılan değere çevirir.
Örnek :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
div { text-transform: capitalize; margin-bottom: 10px;}
.one { text-transform: none; }
.two { text-transform: capitalize }
.three { text-transform: uppercase; }
.four { text-transform: lowercase; }
.five { text-transform: initial; }
.six { text-transform: capitalize; }
.six-child { text-transform: inherit; }
</style>
<body>
<div class="one">
Tasarım ve yazılım
</div>
<div class="two">
Tasarım ve yazılım
</div>
<div class="three">
Tasarım ve yazılım
</div>
<div class="four">
Tasarım ve yazılım
</div>
<div class="five">
Tasarım ve yazılım
</div>
<div class="six">
Tasarım ve yazılım
<div class="six-child">
html ve css
</div>
</div>
</body>
</html>
Html Çıktısı:
Başka bir yazımızda görüşmek üzere…