14 Mei 2014

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 :)

2 komentar:

  1. hmm blog profesinal yg suka merubah-rubah design kayaknya main edit css deh, jadi ga perlu edit2 lagi semua artikel yg telah ditulis

    BalasHapus
    Balasan
    1. ya emang yo :D
      kalo edit manual ya capek

      Hapus

Populer Terbaru Komentar

Entri Terbaru

Komentar Terbaru

Creative Commons License
All contents by Iskael is licensed under a Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License.
Based on a work at Iskael.
Permissions beyond the scope of this license may be available at Iskael.
© 2013 Belajar Ngeblog bersama Iskael. All Right Reserved. Powered by Blogger. Iskael Template by Iskael. Submitted on TopBlogIndonesia