Menggunakan Fungsi Calc() pada CSS

Hallo teman-teman, pada kesempatan kali ini saya akan memberikan sebuah trik tentang css. Dalam bahasa program pasti kalian sering mendengan kata function atau fungsi. Function juga dikenal sebagai kumpulan baris kode yang sudah diatur dengan ketentuan baku untuk dapat langsung digunakan oleh pembuat program.

Ketahuilah bahwa ternyata css juga memiliki function. Contoh function yang ada adalah function calc()
 pada css. Fungsi ini memberikan ketentuan untuk melakukan operasi aritmatika pada css. dan biasanya digunakan sebagai penentu ukuran.

Contoh dalam penggunaan function Calc() pada css adalah sebagai berikut:

Pada selector div1 terdapat width dengan value calc(100% - 100px)

yang berarti lebar dari div1 tersebut adalah 100% dari lebar parent-nya dan dikurangi 100px.

Maka jika parrent-nya 1000px, berarti lebar dari div1 tersebut adalah 900px

 

sebagai contoh, saya terapkan dengan html seperti berikut

 

maka akan tampil pada browser seperti dibawah ini

 

Baiklah teman-teman, saya kira itu saja yang saya bahas pada artikel tentang cara menggunakan fungsi calc pada css. Semoga bermanfaat.

23 November 2016

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat