CSS Dasar

Assessment ini dirancang untuk mengukur pemahamanmu tentang CSS (Cascading Style Sheets) dan kemampuanmu menggunakannya untuk mengatur tampilan, layout, responsivitas, serta interaksi visual pada halaman web.

Materi assessment mencakup konsep CSS mulai dari selector dan pewarnaan hingga layout modern menggunakan Flexbox dan Grid, responsive design, animasi, serta bagaimana browser menentukan aturan CSS yang digunakan ketika terdapat beberapa aturan yang saling bertentangan.

Soal-soal tidak hanya menguji kemampuan menghafal property atau syntax CSS, tetapi juga pemahaman tentang cara kerja CSS, hubungan antar-property, serta penerapannya dalam situasi nyata ketika membangun antarmuka web modern.

Beberapa materi yang akan diujikan meliputi:

• Selector & targeting — memahami penggunaan selector berdasarkan tag, class, dan ID, termasuk kombinasi selector, pseudo-class seperti :hover dan :focus, serta pseudo-element seperti ::before dan ::after.
• Warna & background — memahami berbagai format warna seperti HEX, RGB, dan HSL, penggunaan opacity, serta pembuatan background menggunakan gradient.
• Teks & typography — memahami pengaturan ukuran font menggunakan px, em, dan rem, pengaturan line-height, serta efek visual seperti text-shadow.
• Box model — memahami bagaimana padding, margin, border, dan ukuran elemen bekerja, termasuk penggunaan box-sizing dan box-shadow.
• Layout & positioning — memahami penggunaan display, position, dan z-index, serta bagaimana elemen ditempatkan dan diatur menggunakan Flexbox dan CSS Grid.
• Responsive design — memahami penggunaan media query, breakpoint, dan unit relatif untuk membuat tampilan yang dapat beradaptasi dengan berbagai ukuran layar, mulai dari perangkat mobile hingga desktop.
• Transform, transition & animation — memahami penggunaan transformasi visual, transition untuk perubahan yang halus, serta @keyframes dan animation untuk membuat animasi yang lebih kompleks.
• Specificity & cascade — memahami bagaimana CSS menentukan aturan yang memiliki prioritas ketika beberapa selector menargetkan elemen yang sama, termasuk konsep specificity, cascade, inheritance, dan urutan aturan.
• Praktik CSS modern — memahami cara memilih pendekatan styling yang tepat, menjaga struktur CSS tetap terorganisir, serta menghindari konflik atau aturan yang tidak diperlukan.

Assessment ini cocok untuk mengukur kemampuan dasar CSS sebelum melanjutkan ke materi responsive UI, component-based styling, JavaScript, maupun framework frontend modern. Pastikan kamu memahami bukan hanya fungsi setiap property, tetapi juga bagaimana property tersebut saling berinteraksi dan memengaruhi hasil akhir tampilan di browser.