Teks Transformasi
Transformasi teks adalah teknik yang digunakan untuk mengubah tampilan teks di halaman web Anda. Anda dapat melakukan berbagai transformasi teks dengan CSS. Di bawah ini, kita akan mencakup beberapa transformasi teks umum, seperti mengubah ukuran, mengubah warna, dan merotasi teks.
1. Transformasi Ukuran Teks (Font Size)
Anda dapat mengubah ukuran teks menggunakan properti font-size
. Contoh:
.teks-ukuran-besar {
font-size: 24px;
}
.teks-ukuran-kecil {
font-size: 12px;
}
2. Transformasi Warna Teks (Color)
Anda dapat mengubah warna teks menggunakan properti color
. Contoh:
.teks-warna-merah {
color: red;
}
.teks-warna-biru {
color: blue;
}
3. Transformasi Rotasi Teks
Anda dapat merotasi teks dengan menggunakan properti transform
dan nilai rotate()
. Contoh:
.teks-rotasi-kanan {
transform: rotate(45deg);
}
.teks-rotasi-kiri {
transform: rotate(-45deg);
}
4. Transformasi Tebal Teks (Font Weight)
Anda dapat mengubah ketebalan teks menggunakan properti font-weight
. Contoh:
.teks-tebal {
font-weight: bold;
}
.teks-tipis {
font-weight: normal;
}
5. Transformasi Miring Teks (Italic)
Anda dapat membuat teks menjadi miring dengan menggunakan properti font-style
. Contoh:
.teks-miring {
font-style: italic;
}
.teks-normal {
font-style: normal;
}
Anda dapat menggabungkan berbagai transformasi ini untuk mencapai efek yang Anda inginkan pada teks Anda. Jangan lupa untuk menambahkan kelas CSS ke elemen HTML Anda sesuai kebutuhan.
Semoga tutorial ini membantu Anda memahami cara melakukan transformasi teks dengan CSS!