Modifikasi Kapitalisasi Huruf dengan CSS

Suatu saat kamu akan dihadapkan dengan permasalahan kapitalisasi huruf. Misalkan dalam sebuah dokumen, kamu ditugaskan untuk mengubahkan seluruh judul dengan menggunakan huruf kapital. Okelah hal itu bisa dilakukan secara manual jika hanya satu atau dua dokumen. Bayangkan saja jika hal itu adalah mengubah seluruh judul entri sebuah blog, yang notabene blog tersebut telah memiliki 2000 entri lebih. Apakah kamu akan mengubahnya secara manual? Tentu saja hal itu adalah tindakan bodoh.

Baca juga: Mengatur Jarak Antarbaris dengan CSS

Lantas, bagaimana solusinya? Ubahlah dengan CSS! CSS mampu membantumu untuk mengubah kapitalisasi huruf. Tak hanya mengubahkan ke bentuk kapital, kamu bisa mengubahkan menjadi huruf kecil. Penasaran bukan bagaimana caranya mengubah kapitalisasi huruf dengan CSS. Berikut ulasannya.

Modifikasi Kapitalisasi Huruf dengan CSS

Dalam CSS, memodifikasi kapitalisasi huruf dilakukan dengan menggunakan properti "text-transform". Text-transform ini memiliki beberapa nilai, seperti: capitalize, uppercase, lowercase, dsb. Berikut ini adalah salah satu contoh implementasi properti text-transform.

See the Pen sAIJd by Iskandar Dzulkarnain (@iskael) on CodePen.

Selain nilai yang disebutkan di atas, masih ada lagi nilai lainnya, yaitu: none dan inherit. Nilai none meniadakan text-transform, sedangkan nilai inherit adalah meniru nilai dari induknya. Bagaimana? Mudah, 'kan? Selamat mencoba :)