Membuat Huruf BESAR kecil dengan CSS (text-transform)

CSS Membuat Huruf Besar Kecil : text transform

Apakah kalian kesulitan dalam mengatur besar kecilnya huruf dalam CSS. Sebenarnya sangat mudah untuk memahaminya. Pengaturan ini ditulis dalam CSS sebagai text-transform.

Jenis text-transform dan fungsinya:

none artinya tanpa menambahkan fungsi apapun.
capitalize ini berfungsi merubah huruf pertama menjadi huruf besar.
uppercase yang ini fungsinya membuat semua huruf menjadi besar.
lowercase membuat semua huruf menjadi kecil.

Contoh atau demo nya

1. text-transform: none

Contoh text yang gw beri efet text-transform normal saja.

<div class='example 1'>
Contoh text yang saya 
beri efet text-transform.
</div>

.example 1
{
text-transform:none;
}

2. text-transform: capitalize

Contoh Text Yang gw Beri Efet Text-Transform Depannya Jadi Besar.

<div class='example 2'>
Contoh text yang saya 
beri efet text-transform.
</div>

.example 2
{
text-transform:capitalize;
}

3. text-transform: uppercase

CONTOH TEXT YANG gw BERI EFET TEXT-TRANSFORM BESAR SEMUA.

<div class='example 3'>
Contoh text yang saya 
beri efet text-transform.
</div>

.example 3
{
text-transform:uppercase;
}

4. text-transform: lowercase

contoh text yang gw beri efet text-transform kecil semua.

<div class='example 4'>
Contoh text yang saya 
beri efet text-transform.
</div>

.example 4
{
text-transform:lowercase;
}

Mungkin sedikit penjelsan dari gw, gw hanya berikan demonya agar sobat lebih memahami perbedaaan masing2 value dari poperti text-transform, dan css ini bisa kita gunkan sebagai trik memudahkan membuat huruf besar semua tanpa mengetikan huruf besar dan bisanya poperti ini dipakai tag heading misalnya h1{text-transform:uppercase;} dan sobat bisa gunakan sesuka sobat pada selektor mana. sekian dan terimakasih semoga bermanfaat, sumber referensi gw http://www.w3schools.com/cssref/pr_text_text-transform.asp.