Trắc nghiệm Tin học 12 Chân trời sáng tạo Bài F12 (có đáp án): Định kiểu CSS cho biểu mẫu

Với 10 câu hỏi trắc nghiệm Tin học 12 Bài F12: Định kiểu CSS cho biểu mẫu có đáp án chi tiết đầy đủ các mức độ sách Chân trời sáng tạo sẽ giúp học sinh lớp 12 ôn luyện trắc nghiệm Tin 12 Khoa học máy tính.

Trắc nghiệm Tin học 12 Chân trời sáng tạo Bài F12 (có đáp án): Định kiểu CSS cho biểu mẫu

PHẦN I. Câu trắc nghiệm nhiều phương án lựa chọn. Thí sinh trả lời từ câu 1 đến câu 10. Mỗi câu hỏi thí sinh chỉ lựa chọn một phương án.

Câu 1: Để làm nổi bật hộp văn bản khi người dùng đặt con trỏ vào, thuộc tính nào cần được sử dụng để thay đổi đường viền của hộp văn bản?

A. background-color

B. border

C. outline

D. box-shadow

Hiển thị đáp án

Đáp án: C

Giải thích: Thuộc tính outline được sử dụng để thay đổi đường viền của hộp văn bản khi người dùng đặt con trỏ vào, mà không làm ảnh hưởng đến kích thước và bố cục của hộp văn bản.

Câu 2: Để định kiểu cho các hộp văn bản trong biểu mẫu với kích thước tổng cộng là 300 pixels, bạn cần sử dụng thuộc tính nào để tính gộp vùng đệm và đường biên vào tổng chiều rộng?

A. box-sizing

B. margin

C. padding

D. border

Hiển thị đáp án

Đáp án: A

Giải thích: Thuộc tính box-sizing với giá trị border-box cho phép 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.

Câu 3: Để làm cho nút nhấn chuyển sang màu đỏ khi đang được nhấn và giữ chuột, thuộc tính nào cần được sử dụng?

A. :hover

B. :focus

C. :checked

D. :active

Hiển thị đáp án

Đáp án: D

Giải thích: Thuộc tính :active được sử dụng để định kiểu cho nút nhấn khi đang được nhấn và giữ chuột.

Câu 4: Để định kiểu cho nút tròn trong trạng thái được chọn, thuộc tính nào cần được sử dụng?

A. :hover

B. :focus

C. :checked

D. :active

Hiển thị đáp án

Đáp án: C

Giải thích: Thuộc tính :checked được sử dụng để định kiểu cho nút tròn hoặc hộp kiểm khi chúng ở trạng thái được chọn.

Câu 5: Để đặt thuộc tính hiển thị cho các phần tử HTML cấp độ block trong biểu mẫu, bạn cần sử dụng giá trị nào cho thuộc tính display?

A. inline

B. flex

C. block

D. none

Hiển thị đáp án

Đáp án: C

Giải thích: Giá trị block của thuộc tính display được sử dụng để đặt các phần tử HTML cấp độ block hiển thị toàn bộ chiều rộng của trang và tuần tự trên từng dòng.

Câu 6: Để đặt màu nền cho hộp văn bản khi con trỏ chuột nằm trên nó, bạn cần sử dụng thuộc tính nào?

A. background-color

B. border-color

C. color

D. outline-color

Hiển thị đáp án

Đáp án: A

Giải thích: Để thay đổi màu nền của hộp văn bản khi con trỏ chuột nằm trên nó, bạn cần sử dụng thuộc tính background-color trong trạng thái :hover.

Câu 7: Để định kiểu cho các hộp kiểm khi chúng không được chọn, thuộc tính nào được sử dụng?

A. :focus

B. :not(:checked)

C. :active

D. :hover

Hiển thị đáp án

Đáp án: B

Giải thích: Thuộc tính :not(:checked) được sử dụng để định kiểu cho các hộp kiểm khi chúng không được chọn.

Câu 8: Để làm cho hộp văn bản có đường viền màu xanh khi người dùng đặt con trỏ vào, thuộc tính nào nên được sử dụng?

A. border-color

B. outline-color

C. background-color

D. text-color

Hiển thị đáp án

Đáp án: B

Giải thích: Thuộc tính outline-color được sử dụng để thay đổi màu của đường viền hộp văn bản khi người dùng đặt con trỏ vào, mà không ảnh hưởng đến kích thước và bố cục.

Câu 9: Để đặt các phần tử <div> và <form> chiếm toàn bộ chiều rộng của trang, thuộc tính nào cần sử dụng?

A. margin

B. display

C. width

D. height

Hiển thị đáp án

Đáp án: B

Giải thích: Thuộc tính display với giá trị block giúp các phần tử <div> và <form> chiếm toàn bộ chiều rộng của trang.

Câu 10: Để định kiểu cho trạng thái khi nút tròn hoặc hộp kiểm được chọn, bạn cần sử dụng lớp nào?

A. :hover

B. :focus

C. :checked

D. :disabled

Hiển thị đáp án

Đáp án: C

Giải thích: Lớp :checked được sử dụng để định kiểu cho nút tròn hoặc hộp kiểm khi chúng ở trạng thái được chọn.

PHẦN II. Câu trắc nghiệm đúng Sai. Thí sinh trả lời từ câu 1 đến câu 2. Trong mỗi ý a), b), c), d) ở mỗi câu, thí sinh chọn đúng hoặc sai

Câu 1: Phát biểu sau đây đúng hay sai về định kiểu cho hộp văn bản?

a) Để định kiểu cho phần tử cấp độ block trong biểu mẫu, sử dụng giá trị block cho thuộc tính display.

b) Thuộc tính box-sizing với giá trị border-box làm cho vùng đệm và đường biên được tính vào tổng chiều rộng của hộp văn bản.

c) Thuộc tính outline làm ảnh hưởng đến kích thước và bố cục của hộp văn bản.

d) Để làm nổi bật hộp văn bản khi người dùng đặt con trỏ vào, khai báo trạng thái :focus là cần thiết.

Hiển thị đáp án

a) Đúng: Các phần tử cấp độ block như <header>, <div>, và các tiêu đề từ <h1> đến <h6> chiếm toàn bộ độ rộng của trang và hiển thị tuần tự trên từng dòng. Để định kiểu cho các phần tử này, sử dụng giá trị block cho thuộc tính display

b) Đúng: Khi sử dụng giá trị border-box cho thuộc tính box-sizing, vùng đệm và đường biên được tính gộp vào tổng chiều rộng của hộp văn bản, giúp dễ dàng kiểm soát kích thước.

c) Sai: Thuộc tính outline không làm ảnh hưởng đến kích thước và bố cục của hộp văn bản; nó chỉ thay đổi cách hiển thị của đường viền xung quanh phần tử.

d) Đúng: Trạng thái :focus cho phép bạn thay đổi cách hiển thị của hộp văn bản khi người dùng đặt con trỏ vào đó, giúp cải thiện khả năng tương tác với biểu mẫu.

Câu 2: Phát biểu sau đây đúng hay sai về định kiểu cho nút tròn, hộp kiểm và nút nhấn?

a) Để định kiểu cho nút tròn, hộp kiểm và nút nhấn, khai báo vùng chọn bằng tên thẻ và thuộc tính type trong cặp ngoặc vuông.

b) Trạng thái :checked dùng để định kiểu cho các nút tròn và hộp kiểm khi chúng được chọn.

c) Để định kiểu cho nút nhấn, sử dụng thuộc tính :hover để thay đổi màu sắc khi con trỏ chuột nằm trên nút.

d) Để định kiểu cho trạng thái nút nhấn khi nhấn và giữ chuột, sử dụng thuộc tính :active.

Hiển thị đáp án

a) : Đúng: Để định kiểu cho các nút tròn, hộp kiểm và nút nhấn, bạn sử dụng vùng chọn với tên thẻ và thuộc tính type trong cặp ngoặc vuông để áp dụng kiểu cho các phần tử này.

b) Đúng: Trạng thái :checked được sử dụng để định kiểu cho các nút tròn và hộp kiểm khi chúng ở trạng thái được chọn

c) Đúng: Thuộc tính :hover thay đổi màu sắc của nút nhấn khi con trỏ chuột nằm trên nút.

d) Đúng: Thuộc tính :active dùng để định kiểu cho trạng thái của nút nhấn khi nó đang được nhấn và giữ chuột.

PHẦN III. Câu trả lời ngắn. Thí sinh trả lời từ câu 1 đến câu 3

Câu 1: Để định kiểu cho phần tử cấp độ block trong biểu mẫu, thuộc tính display cần được đặt giá trị gì?

Hiển thị đáp án

Đáp án: block

Giải thích: Các phần tử HTML cấp độ block như <header>, <div>, và các tiêu đề từ <h1> đến <h6> chiếm toàn bộ độ rộng của trang và hiển thị tuần tự trên từng dòng. Để định kiểu cho các phần tử này, thuộc tính display cần được đặt giá trị block.

Câu 2: Thuộc tính box-sizing với giá trị nào giúp 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?

Hiển thị đáp án

Đáp án: border-box

Giải thích: Giá trị border-box của thuộc tính box-sizing làm cho vùng đệm và đường biên được tính gộp vào tổng chiều rộng của hộp văn bản, giúp dễ dàng kiểm soát kích thước.

Câu 3: Để định kiểu cho trạng thái nút nhấn khi con trỏ chuột nằm trên nút, thuộc tính nào cần được sử dụng?

Hiển thị đáp án

Đáp án: :hover

Giải thích: Trạng thái :hover được sử dụng để định kiểu cho các nút nhấn khi con trỏ chuột nằm trên nút, thay đổi cách hiển thị của nút trong trạng thái này.

Xem thêm câu hỏi trắc nghiệm Tin học lớp 12 Chân trời sáng tạo có đáp án hay khác:

• Trắc nghiệm Tin học 12 Bài F13: Dự án tạo trang web (tiếp theo)

• Trắc nghiệm Tin học 12 Bài F14: Học máy

• Trắc nghiệm Tin học 12 Bài F15: Khoa học dữ liệu

• Trắc nghiệm Tin học 12 Bài F16: Máy tính, thuật toán và Khoa học dữ liệu

• Trắc nghiệm Tin học 12 Bài F17: Hoạt động trải nghiệm về Khoa học dữ liệu

Xem thêm các tài liệu học tốt lớp 12 hay khác:

• Giải sgk Tin học 12 Chân trời sáng tạo
• Giải Chuyên đề Tin học 12 Chân trời sáng tạo
• Giải SBT Tin học 12 Chân trời sáng tạo
• Giải lớp 12 Chân trời sáng tạo (các môn học)
• Giải lớp 12 Kết nối tri thức (các môn học)
• Giải lớp 12 Cánh diều (các môn học)

---