Tutorial CSS 4 : Unit Pengukuran CSS

Sebelum kita memulai latihan sebenarnya, kami ingin memberikan ide singkat tentang Unit Pengukuran CSS.

Sebelum kita memulai latihan sebenarnya, kami ingin memberikan ide singkat tentang Unit Pengukuran CSS.

CSS mendukung sejumlah pengukuran termasuk unit mutlak seperti inci, sentimeter, poin, dan seterusnya, serta langkah-langkah relatif seperti persentase dan unit em. Anda perlu nilai-nilai ini sementara menetapkan berbagai pengukuran dalam aturan Style Anda mis border = "1px red solid".

Kami telah terdaftar semua Unit Pengukuran CSS bersama dengan Contoh yang tepat

Unit	Deskripsi	Contoh
%	Mendefinisikan pengukuran sebagai persentase relatif terhadap nilai lain, biasanya unsur melampirkan.	p {font-size: 16pt; line-height: 125%;}
cm	Mendefinisikan pengukuran dalam sentimeter.	div {margin-bottom: 2cm;}
em	Sebuah pengukuran relatif tinggi font di ruang em. Karena unit em setara dengan ukuran font yang diberikan, jika Anda menetapkan font untuk 12pt, masing-masing "em" unit akan 12pt; dengan demikian, 2em akan 24pt.	p {letter-spacing: 7em;}
ex	Nilai ini mendefinisikan pengukuran relatif font x-height. X-height ditentukan oleh ketinggian font huruf kecil x.	p {font-size: 24pt; line-height: 3ex;}
in	Mendefinisikan pengukuran dalam inci.	p {word-spacing: .15in;}
mm	Mendefinisikan pengukuran dalam milimeter.	p {word-spacing: 15mm;}
pc	Mendefinisikan pengukuran di Picasa pica setara dengan 12 poin; dengan demikian, ada 6 picas per inci.	p {font-size: 20pc;}
pt	Mendefinisikan pengukuran di titik. Sebuah titik didefinisikan sebagai 1/72 inci.	body {font-size: 18pt;}
px	Mendefinisikan pengukuran dalam layar piksel .	p {padding: 25px;}
vh	1% dari tinggi viewport.	h2 { font-size: 3.0vh; }
vw	1% dari lebar viewport	h1 { font-size: 5.9vw; }
vmin	1vw atau 1vh, mana yang lebih kecil	p { font-size: 2vmin;}