DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MENGATUR POSISI TULISAN DI CSS

Artikel ini akan membantu kamu memahami cara mengatur posisi tulisan di CSS, langkah demi langkah, dengan penjelasan yang mudah dipahami dan dipraktekkan.

Mengatur posisi tulisan di CSS merupakan salah satu kemampuan dasar yang harus dimiliki oleh seorang web developer. Dengan pengetahuan ini, kamu bisa membuat halaman website menjadi lebih tertata dan enak dilihat. Dalam artikel ini, kita akan membahas bagaimana cara mengatur posisi teks secara horizontal dan vertikal dalam CSS.

Mengatur Posisi Teks Secara Horisontal

Posisi teks secara horisontal bisa kamu atur dengan properti text-align. Ada beberapa nilai yang bisa digunakan pada properti ini, antara lain:

text-align: left;

Kode ini akan membuat teks rata kiri. Ini adalah nilai default untuk properti text-align.

text-align: right;

Ini akan membuat teks rata kanan.

text-align: center;

Seperti namanya, kode ini akan membuat teks berada di tengah-tengah.

text-align: justify;

Kode ini membuat teks sejajar baik di sisi kiri maupun kanan.

Mengatur Posisi Teks Secara Vertikal

Untuk mengatur posisi teks secara vertikal, kamu bisa menggunakan properti vertical-align. Berikut adalah beberapa nilai yang bisa digunakan:

vertical-align: baseline;

Ini adalah nilai default untuk properti vertical-align. Teks akan sejajar dengan garis dasar dari elemen parentnya.

vertical-align: sub;

Nilai ini membuat teks berada sedikit lebih rendah dari baseline dan ukurannya menjadi lebih kecil.

vertical-align: super;

Ini akan membuat teks berada sedikit lebih tinggi dari baseline dan ukurannya menjadi lebih kecil.

vertical-align: top;

Teks akan berada di bagian atas elemen parentnya.

vertical-align: middle;

Teks akan berada di tengah elemen parentnya.

vertical-align: bottom;

Teks berada di bagian bawah elemen parentnya.

Dengan menguasai cara mengatur posisi teks di CSS, kamu jadi bisa membuat tampilan situs web yang lebih menarik dan profesional. Selamat mencoba!


Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding