Tutorial Belajar CSS Bagian 4 : Tabel Satuan Pengukuran di CSS

Pada tutorial sebelumnya, kita sudah mempelajari Tutorial Belajar CSS Bagian 3 : Cara Menyisipkan Kode CSS di HTML, kali ini kita akan mempelajari satuan pengukuran di CSS.

Sebelum berlatih Menyusun kode CSS, ada baiknya kita mempelajari apa saja satuan pengukuran yang digunakan dalam CSS.

CSS mendukung sejumlah satuan pengukuran termasuk satuan absolut seperti inci, sentimeter, titik, dan seterusnya, serta ukuran relatif seperti persentase dan satuan em.

Anda membutuhkan nilai-nilai ini saat menentukan berbagai pengukuran dalam aturan style yang Anda buat, misalnya satuan pixel (px) untuk class . border = “1px merah solid”.

Pada tabel di bawah ini, saya telah membuat daftar semua Unit pengukuran CSS bersama dengan contoh yang tepat :

Unit	Deskripsi	Contoh
%	Mendefinisikan pengukuran dalam persentase relatif terhadap nilai lain, biasanya digunakan pada elemen penutup	.p {font-size: 16pt; line-height: 125%;}
cm	Mendefinisikan ukuran dalam sentimeter	.div {margin-bottom: 2cm;}
em	Sebuah pengukuran relatif untuk tinggi font dalam em. Karena unit em setara dengan ukuran font tertentu, jika Anda menetapkan font ke 12pt, setiap unit “em” akan menjadi 12pt; dengan demikian, 2em akan menjadi 24pt	.p {letter-spacing: 7em;}
ex	Nilai ini mendefinisikan pengukuran relatif terhadap tinggi-x font. Tinggi x ditentukan oleh tinggi huruf kecil font x	.p {font-size: 24pt; line-height: 3ex;}
in	Mendefinisikan pengukuran dalam inci	.p {letter-spacing: .15in;}
mm	Mendefinisikan ukuran dalam milimeter	.p {letter-spacing: 15mm;}
pc	Mendefinisikan pengukuran dalam picas. Pica setara dengan 12 poin; jadi, ada 6 picas per inci	.p {font-size: 20pc;}
pt	Mendefinisikan pengukuran dalam poin. 1 point didefinisikan sebagai 1/72 inci	.body{font-size: 18pt;}
px	Mendefinisikan pengukuran dalam piksel layar	.p {padding: 25px;}