wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

Quiz tentang Layout Responsive dengan HTML dan CSS

Total questions: 10

Worksheet time: 5mins

Name
Class
Date
1.

Apa yang dimaksud dengan layout responsive?

a)

Teknik untuk mengoptimalkan gambar

b)

Teknik untuk membuat website hanya untuk desktop

c)

Teknik untuk membuat website terlihat optimal di berbagai perangkat

d)

Teknik untuk menambahkan animasi pada website

2.

Apa fungsi dari meta tag viewport?

a)

Mengatur ukuran viewport dan skala halaman web

b)

Menambahkan gambar ke halaman web

c)

Mengatur warna latar belakang

d)

Menambahkan efek transisi

3.

Apa yang dilakukan media queries dalam CSS?

a)

Mengubah warna teks

b)

Mengatur ukuran font

c)

Menambahkan gambar ke halaman web

d)

Menerapkan gaya CSS yang berbeda berdasarkan karakteristik perangkat

4.

Apa yang terjadi pada sidebar ketika lebar layar kurang dari atau sama dengan 768px?

a)

Sidebar ditampilkan dengan lebar 50%

b)

Sidebar disembunyikan

c)

Sidebar ditampilkan dengan warna berbeda

d)

Sidebar ditampilkan di atas konten utama

5.

Apa yang digunakan untuk mengatur layout konten dalam baris dan kolom?

a)

Flexbox

b)

Position

c)

Grid layout

d)

Float

6.

Apa yang dilakukan kode CSS '.container { display: grid; }'?

a)

Mengatur elemen dalam grid

b)

Mengatur elemen dalam flexbox

c)

Mengatur elemen menjadi inline

d)

Mengatur elemen menjadi block

7.

Apa yang harus dilakukan untuk mengoptimalkan gambar pada layout responsive?

a)

Menggunakan gambar berformat JPEG saja

b)

Menggunakan gambar berformat PNG saja

c)

Menggunakan gambar dengan ukuran yang sama untuk semua perangkat

d)

Menggunakan gambar dengan ukuran yang berbeda untuk berbagai perangkat

8.

Apa yang dimaksud dengan 'flex-wrap' dalam CSS?

a)

Mengatur warna latar belakang

b)

Membungkus konten jika tidak muat dalam satu baris

c)

Mengatur jarak antar elemen

d)

Mengatur ukuran font

9.

Apa yang dilakukan kode CSS '@media (max-width: 768px)'?

a)

Menerapkan gaya untuk layar dengan lebar maksimum 768px

b)

Mengatur ukuran font untuk semua layar

c)

Mengubah warna teks untuk semua layar

d)

Menambahkan gambar untuk layar kecil

10.

Apa yang harus dilakukan untuk menguji layout responsive?

a)

Uji layout di berbagai browser dan perangkat

b)

Uji layout hanya di smartphone

c)

Uji layout hanya di satu browser

d)

Uji layout hanya di desktop