Kiểm tra CSS Responsive

Thiết Kế Website Responsive – Tương Thích Với Mọi Thiết Bị!
Bài thì Kiểm tra CSS Responsive

Câu 1: Thuộc tính CSS nào thường được sử dụng để làm giao diện web đáp ứng?

A) @media

B) @responsive

C) media-query

D) @device

None

Câu 2: Cú pháp nào đúng để viết Media Query cho thiết bị có chiều rộng nhỏ hơn hoặc bằng 768px?

A) @media (width <= 768px) { ... }

B) @media screen and (max-width: 768px) { ... }

C) @responsive (max-width: 768px) { ... }

D) @media screen { max-width: 768px; }

None

Câu 3: Đơn vị nào dưới đây được coi là đơn vị tỷ lệ và thường được sử dụng trong CSS Responsive?

A) px

B) em

C) rem

D) Cả B và C

None

Câu 4: Trong CSS Responsive, thuộc tính nào được sử dụng để ngăn nội dung không vượt ra khỏi khung chứa?

A) max-width

B) width

C) overflow

D) height

None

Câu 5: Cách nào để tạo một hình ảnh đáp ứng kích thước khung chứa?

A) width: auto; height: 100%;

B) max-width: 100%; height: auto;

C) width: 100%; height: auto;

D) width: 100%; height: 100%;

None

Câu 6: Giá trị vw trong CSS có nghĩa là gì?

A) Chiều rộng phần tử tính theo phần trăm của viewport.

B) Chiều cao phần tử tính theo phần trăm của viewport.

C) Chiều rộng viewport tính bằng pixel.

D) Tỷ lệ phần trăm chiều cao viewport.

None

Câu 7: Cú pháp @media screen and (min-width: 1024px) có nghĩa là gì?

A) Áp dụng CSS cho màn hình có chiều rộng lớn hơn hoặc bằng 1024px.

B) Áp dụng CSS cho màn hình có chiều rộng nhỏ hơn 1024px.

C) Áp dụng CSS cho thiết bị có độ phân giải màn hình là 1024px.

D) Áp dụng CSS cho màn hình có chiều cao lớn hơn 1024px.

None

Câu 8: Thuộc tính nào của Flexbox thường được dùng để thiết kế layout đáp ứng?

A) flex-grow, flex-shrink, flex-basis

B) justify-content, align-items, align-content

C) flex-wrap và flex-direction

D) Cả A, B và C

None

Câu 9: Trong CSS Responsive, làm thế nào để ẩn một phần tử trên màn hình nhỏ hơn 600px?

A) @media (max-width: 600px) { display: hidden; }

B) @media (max-width: 600px) { visibility: hidden; }

C) @media (max-width: 600px) { visibility: hidden; }

D) @media (max-width: 600px) { hide: true; }

None

Câu 10: Cách nào giúp thiết kế bảng dữ liệu trở nên thân thiện hơn trên thiết bị di động?

A) Sử dụng scrollable table (bảng có thanh cuộn).

B) Thu nhỏ kích thước font chữ.

C) Chuyển đổi bảng thành danh sách (list) trên màn hình nhỏ.

D) Cả A và C.

None

Time's up

Đăng bởi thangtbay | Tháng mười một 25, 2024 | |

• Bài viết cùng chủ đề

• AEO là gì? Liệu bạn đã hiểu rõ sự khác nhau giữa GEO và AEO?

• Cá nhân có đăng ký được tên miền .vn không? Phân biệt rõ cá nhân và tổ chức khi đăng ký domain Việt Nam

• Thông báo thay đổi điều kiện đăng ký và duy trì tên miền .edu.vn từ ngày 10/02/2026

• Doanh nghiệp đang chết dần vì website không tạo ra dữ liệu – Bạn có đang nằm trong số đó?

• Cách AI lựa chọn nguồn thông tin và ảnh hưởng đến Website doanh nghiệp