Address

Perm. Handayani, Jl. Handayani, Pekanbaru, Riau

Contact

Cascading style sheets atau biasa dikenal dengan CSS memiliki beberapa pilihan untuk menentukan sebuah ukuran dari masing-masing propertinya. Dengan menggunakan satuan ukur yang tepat tentunya akan semakin mempermudah dalam pembuatan style sebuah elemen.

Sebelum membahas lebih detail satuan ukuran biasanya ini berkaitan dengan css unit. Css unit merupakan sebuah satuan untuk menentukan ukuran dari suatu elemen. Misalnya jika Anda ingin menentukan padding dari sebuah elemen tentunya akan diisi dengan sebuah nilai dan satuan akhir, satuan akhir itulah disebut dengan css unit.

Seperti contoh dibawah ini:

p {
  padding: 10px;
}

Kode diatas dimana kita akan menyeleksi elemen p dengan padding 10px. Padding merupakan propertinya yang diatur, sementara 10 adalah nilainya dan px(pixel) merupakan satuanyya (css unit). Css unit memiliki 2 jenis, diantaranya Absolute dan Relative. Berikut penjelasannya:

Absolute Unit

Absolute unit akan selalu memiliki ukuran yang sama apapun itu berdasarkan elemen parentnya taupun berdasarkan ukuran layar. Sebagai contoh, jika Anda menggunakan satuan Absolute Unit akan memiliki tampilan yang sama pada layar desktop dan mobile.

Absolute unit digunakan jika Anda tidak memikirkan tampilan responsive. Satuan ukur pada absolute unit seperti Pixel (px).

h2 {
  font-size: 35px;
}

Relative Unit

Relative unit biasanya sering digunakan pada sebuah project yang responsive, karena ukurannya dapat berubah dan menyesuaikan terhadap parent atau ukuran layar. Sehinga Anda tidak perlu lagi banyak merubah kode saat ingin membuatnya lebih responsive.

Berikut satuan Relative Unit yang umum dipakai:

em, lebih cocok digunakan untuk satuan ukur font size.

rem, hampir sama dengan em, ukurannya relatif berdasarkan font-size root elemen html.

vh (view port), digunakan untuk satuan ukur tinggi sebuah elemen

vw (view width), digunakan untuk satuan ukur lebar

%, ukurannya relatif terhadap parent element.


administrator

Eko Pramono lebih akrab disapa Pram, seorang web developer, suka nulis, suka ngegame, dan suka turing. Bekerja di salah satu perusahaan Digital Marketing.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.