HomeTutorial CSSSatuan Ukuran pada CSS

Satuan Ukuran pada CSS

Kali ini kita akan membahas mengenai satuan ukuran pada CSS yang sering digunakan. Sebelumnya kita telah membahas mengenai cara menghubungkan CSS ke HTML. Satuan ukuran CSS sangat diperlukan untuk mendesain tata letak bagian – bagian sebuah website.

Apa Saja Ukuran Satuan pada CSS…?

CSS mendukung banyak ukuran termasuk satuan mutlak seperti inches, Centimeters, Points, dan lain – lain. Selain itu, terdapat ukuran  relatif seperti persen dan satuan em. Anda membutuhkan angka tersebut untuk mendefinisikan pada aturan CSS. Misalnya : border=”2px solid blue”.

Tabel Satuan Ukuran pada CSS

Satuan

Deskripsi

Contoh

pxUkuran piksel pada layarp {margin-bottom: 12px;}
ptUkuran dalam titik (point). Sebuah titik didefinisikan sebagai 1/72 inchi.body {font-size: 14pt;}
pcUkuran dalam picas. Satu pica sama dengan 12 titik. Maka ada 6 picas per inch.p {font-size: 20pc;}
mmUkuran dalam millimeter.p {word-spacing: 10mm;}
cmUkuran dalam centimeter.p {margin-top: 3cm;}
inUkuran dalam inchi.p {word-spacing: .2in;}
%Ukuran relatif dalam persentase terhadap nilai lain.p {font-size: 12pt; line-height: 150%;}
emUkuran relatif untuk tinggi dari sebuah font dalam em space. Satuan em sama dengan ukuran font yang diberikan. Jika kita menetapkan ukuran font menjadi 12pt, maka setiap satuan “em” akan menjadi 12pt. Maka 1.5em menjadi 18pt dan 2em menjadi 24pt..test {font-size: 1.2em;}
exUkuran relatif dari tinggi font x. x-height (tinggi font x) sama dengan tinggi dari font x dalam keadaan lowercase. (huruf kecil). Maka 2ex menjadi 2 kali tinggi huruf x.p {font-size: 24pt; line-height:2ex;}

Demikian tutorial belajar CSS mengenai satuan ukuran CSS untuk desain tatak letak website. Selanjutnya kita akan membahas mengenai penggunaan warna pada CSS. Semoga bermanfaat dan terima kasih.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.