Phiếu trắc nghiệm Khoa học máy tính 12 chân trời Bài F12: Định kiểu CSS cho biểu mẫu

Chủ đề F: Giải quyết vấn đề với sự trợ giúp của máy tính

Bài F1: Định kiểu CSS cho biểu mẫu

(21 câu)

A. TRẮC NGHIỆM

1. NHẬN BIẾT (10 câu)

Câu 1: Thuộc tính CSS nào được sử dụng để định kiểu cách hiển thị của các thành phần biểu mẫu?

A. size

B. display

C. type

D. value

Câu 2: Giá trị nào của thuộc tính display được sử dụng để định kiểu cho các phần tử cấp độ block?

A. inline

B. block

C. none

D. flex

Câu 3: Thuộc tính CSS nào được sử dụng để tính gộp vùng đệm và đường biên vào tổng chiều rộng của hộp văn bản?

A. width

B. height

C. box-sizing

D. padding

Câu 4: Giá trị nào của thuộc tính box-sizing được sử dụng để tính gộp vùng đệm và đường biên?

A. content-box

B. padding-box

C. border-box

D. margin-box

Câu 5: Lớp giả CSS nào được sử dụng để định kiểu hộp văn bản khi người dùng đặt con trỏ vào?

A. :hover

B. :active

C. :focus

D. :visited

Câu 6: Thuộc tính CSS nào không ảnh hưởng đến kích thước và bố cục của hộp văn bản?

A. border

B. padding

C. outline

D. margin

Câu 7: Lớp giả CSS nào được sử dụng để định kiểu nút tròn và hộp kiểm khi chúng được chọn?

A. :hover

B. :active

C. :focus

D. :checked

Câu 8: Lớp giả CSS nào được sử dụng để định kiểu nút nhấn khi người dùng di chuột qua nó?

A. :hover

B. :active

C. :focus

D. :checked

Câu 9: Lớp giả CSS nào được sử dụng để định kiểu nút nhấn khi người dùng nhấp và giữ chuột vào nó?

A. :hover

B. :active

C. :focus

D. :checked

Câu 10: Vùng chọn CSS nào dùng để chọn hộp văn bản nhập liệu?

A. input[type="radio"]

B. input[type="checkbox"]

C. input[type="text"]

D. input[type="button"]

2. THÔNG HIỂU (5 CÂU)

Câu 1:  Tại sao cần sử dụng box-sizing: border-box; khi định kiểu hộp văn bản?

A. Để tăng kích thước của hộp văn bản

B. Để giảm kích thước của hộp văn bản

C. Để tính gộp vùng đệm và đường biên vào tổng chiều rộng của hộp văn bản

D. Để loại bỏ vùng đệm và đường biên của hộp văn bản

Câu 2: Tại sao cần sử dụng lớp giả :focus khi định kiểu hộp văn bản?

A. Để làm nổi bật hộp văn bản khi người dùng di chuột qua nó

B. Để làm nổi bật hộp văn bản khi người dùng nhấp chuột vào nó

C. Để làm nổi bật hộp văn bản khi người dùng đặt con trỏ vào nó

D. Để làm nổi bật hộp văn bản khi người dùng đã nhập dữ liệu vào nó

Câu 3: Điều gì xảy ra nếu không sử dụng box-sizing: border-box; cho hộp văn bản?

A. Vùng đệm và đường biên sẽ được tính vào tổng chiều rộng của hộp văn bản

B. Vùng đệm và đường biên sẽ không được tính vào tổng chiều rộng của hộp văn bản

C. Hộp văn bản sẽ không hiển thị

D. Trình duyệt sẽ hiển thị lỗi

Câu 4: Tại sao cần sử dụng vùng chọn input[type="text"] để định kiểu hộp văn bản?

A. Để chọn tất cả các phần tử input trên trang web

B. Để chọn chỉ các phần tử input có kiểu là văn bản

C. Để chọn chỉ các phần tử input có kiểu là nút tròn

D. Để chọn chỉ các phần tử input có kiểu là hộp kiểm

...........................................

...........................................

...........................................

B. CÂU HỎI TRẮC NGHIỆM ĐÚNG – SAI (1 CÂU)

Câu 1: CSS cung cấp các thuộc tính và lớp giả để định kiểu cho các thành phần biểu mẫu như hộp văn bản, nút tròn, hộp kiểm và nút nhấn.

a) Thuộc tính display: inline; dùng để định kiểu cho các phần tử cấp độ block.

b) Lớp giả :focus dùng để định kiểu hộp văn bản khi người dùng đặt con trỏ vào.

c) Vùng chọn input[type="button"] chỉ dùng để chọn nút tròn.

d) Lớp giả :checked dùng để định kiểu nút tròn và hộp kiểm khi chúng được chọn.

Đáp án:

a) S

b) Đ

c) S

d) Đ

...........................................

...........................................

...........................................