Trắc Nghiệm Tin Học 12 Chân Trời Sáng Tạo Tin Học Ứng Dụng Bài F12 là bộ đề ôn tập kiến thức thực hành môn Tin học lớp 12, bám sát nội dung Tin học 12 Tin học ứng dụng Chân trời sáng tạo. Đề do cô Lê Thị Tuyết Nga – giáo viên môn Tin học tại Trường THPT Thăng Long biên soạn năm học 2024–2025. Đây là bài học quan trọng thuộc “Chủ đề F. Giải quyết vấn đề với sự trợ giúp của máy tính”, với nội dung chính của “Bài F12. Định kiểu CSS cho biểu mẫu” tập trung vào việc sử dụng các thuộc tính CSS để tùy chỉnh giao diện của biểu mẫu (form), bao gồm màu sắc, font chữ, kích thước của các ô nhập liệu, nút bấm và cách bố cục tổng thể biểu mẫu trên trang web. Bộ câu hỏi này là tài liệu quan trọng giúp học sinh nắm vững kỹ năng thiết kế giao diện web tương tác.
Trắc nghiệm Tin học 12 trên nền tảng detracnghiem.edu.vn được thiết kế để mang lại trải nghiệm học tập thực tế và hiệu quả. Với kho câu hỏi phong phú, mô phỏng các tình huống định dạng biểu mẫu đa dạng, học sinh có thể thực hành không giới hạn để củng cố kiến thức. Mỗi câu hỏi đều đi kèm đáp án và lời giải thích chi tiết, giúp các em không chỉ biết kết quả mà còn hiểu sâu sắc về cách thức hoạt động của từng thuộc tính CSS và sự ảnh hưởng của chúng đến trải nghiệm người dùng. Biểu đồ phân tích tiến độ học tập cá nhân là tính năng nổi bật, giúp học sinh nhận diện điểm mạnh, điểm yếu để xây dựng chiến lược ôn tập khoa học. Đây là công cụ hữu ích giúp học sinh tự tin chinh phục các bài Trắc nghiệm các môn lớp 12.
Trắc Nghiệm Tin Học 12 Chân Trời Sáng Tạo Tin Học Ứng Dụng
Chủ đề F. Giải quyết vấn đề với sự trợ giúp của máy tính
Bài F12. Định kiểu CSS cho biểu mẫu
Câu 1: Việc định kiểu cho biểu mẫu bằng CSS mang lại lợi ích gì ngoài việc cải thiện tính thẩm mỹ?
A. Giúp tăng cường khả năng tiếp cận và trải nghiệm người dùng.
B. Giúp tăng tốc độ xử lí dữ liệu của biểu mẫu trên máy chủ.
C. Giúp giảm thiểu số lượng mã HTML cần thiết để tạo biểu mẫu.
D. Giúp tăng cường tính bảo mật cho dữ liệu được gửi đi.
Câu 2: Để một phần tử <label> chiếm trọn một dòng và đẩy các phần tử khác xuống dưới, thuộc tính display cần có giá trị là gì?
A. inline.
B. inline-block
C. block.
D. none.
Câu 3: Thuộc tính box-sizing: border-box; có tác dụng gì khi định kiểu cho một hộp văn bản?
A. Làm cho chiều rộng của hộp văn bản tự động co giãn.
B. Loại bỏ hoàn toàn đường viền và vùng đệm của hộp văn bản.
C. Làm cho vùng đệm và đường viền nằm ngoài chiều rộng đã định.
D. Gộp vùng đệm và đường viền vào trong chiều rộng đã định.
Câu 4: Để làm nổi bật một hộp văn bản khi người dùng đặt con trỏ vào, bộ chọn trạng thái nào sau đây được sử dụng?
A. :hover.
B. :active.
C. :checked.
D. :focus.
Câu 5: Thuộc tính outline trong CSS được sử dụng để làm gì khi định kiểu cho trạng thái :focus của một hộp văn bản?
A. Thay đổi màu nền của hộp văn bản.
B. Tạo một đường viền bao quanh mà không ảnh hưởng bố cục.
C. Thay đổi màu chữ bên trong hộp văn bản.
D. Thay đổi kiểu đường viền của hộp văn bản.
Câu 6: Nút tròn (radio button) và hộp kiểm (checkbox) có hai trạng thái cơ bản nào để định kiểu bằng CSS?
A. Trạng thái hover và active.
B. Trạng thái focus và visited.
C. Trạng thái checked và không được chọn.
D. Trạng thái link và hover.
Câu 7: Để định kiểu cho một nút tròn (<input type="radio">) khi nó đang ở trạng thái được chọn, bộ chọn nào sau đây là đúng?
A. input[type="radio"]:active.
B. input[type="radio"]:checked.
C. input[type="radio"]:focus.
D. input[type="radio"]:hover.
Câu 8: Thuộc tính accent-color trong CSS được sử dụng để làm gì khi định kiểu cho hộp kiểm và nút tròn?
A. Thay đổi màu nền của toàn bộ biểu mẫu.
B. Thay đổi màu của đường viền bao quanh.
C. Thay đổi màu của dấu tích hoặc chấm tròn.
D. Thay đổi màu của văn bản nhãn đi kèm.
Câu 9: Để định kiểu cho một nút nhấn (<button type="submit">) khi người dùng di chuột lên trên, bộ chọn nào được sử dụng?
A. :hover.
B. :active.
C. :focus.
D. :checked.
Câu 10: Trạng thái :active của một nút nhấn xảy ra khi nào?
A. Khi con trỏ chuột đang nằm trên nút nhấn.
B. Khi nút nhấn được chọn bằng bàn phím.
C. Khi biểu mẫu đã được gửi đi thành công.
D. Khi người dùng đang nháy và giữ chuột trên nút.
Câu 11: Em hãy trình bày bảy lợi ích khi định kiểu cho biểu mẫu.
A. Giúp biểu mẫu đẹp hơn và dễ nhìn hơn.
B. Giúp tăng tốc độ nhập liệu của người dùng.
C. Cải thiện thẩm mỹ, trải nghiệm và tính nhất quán.
D. Giúp tăng cường tính bảo mật cho dữ liệu.
Câu 12: Ý nghĩa của thuộc tính display và box-sizing là gì?
A. display định kiểu hiển thị, box-sizing định kiểu kích thước.
B. display định kiểu màu sắc, box-sizing định kiểu kích thước.
C. display định kiểu kích thước, box-sizing định kiểu hiển thị.
D. display định kiểu vị trí, box-sizing định kiểu đường viền.
Câu 13: Em hãy liệt kê một số trạng thái của các thành phần trong biểu mẫu và nêu cách khai báo vùng chọn để định kiểu cho chúng.
A. Có trạng thái :hover cho tất cả các thành phần.
B. Có các trạng thái :hover, :focus, :checked, :active.
C. Có trạng thái :checked cho nút tròn và hộp kiểm.
D. Có trạng thái :focus cho các hộp văn bản.
Câu 14: Để định kiểu cho một biểu mẫu có độ rộng tối đa là 400 pixel và được căn giữa theo chiều ngang, đoạn mã CSS nào sau đây là đúng?
A. form { width: 400px; text-align: center; }.
B. form { max-width: 400px; text-align: center; }.
C. form { width: 400px; margin: auto; }.
D. form { max-width: 400px; margin: 0 auto; }.
Câu 15: Một học sinh muốn định kiểu cho các hộp văn bản nhập “Họ tên” và “Lớp” có nền màu xám và không có đường viền. Đoạn mã CSS nào sau đây là đúng?
A. input.text { background: #f4f4f4; border: 0; }.
B. input[type="text"] { background-color: #f4f4f4; border: none; }.
C. input { background-color: #f4f4f4; no-border: true; }.
D. input[type="text"] { background-color: #f4f4f4; border: none; }.
Câu 16: Để định kiểu cho một hộp văn bản <textarea> có thể thay đổi kích thước theo chiều dọc, thuộc tính nào được sử dụng?
A. resize: vertical;.
B. resize: horizontal;.
C. resize: both;.
D. resize: none;.
Câu 17: Để thay đổi hình dạng con trỏ chuột thành hình bàn tay khi di chuột lên một nút nhấn, thuộc tính nào được sử dụng?
A. mouse: pointer;.
B. hover: pointer;.
C. cursor: pointer;.
D. pointer: hand;.
Câu 18: Một học sinh muốn định kiểu nền chung cho hai nút tròn và màu nền chung cho ba hộp kiểm của biểu mẫu. Cách tiếp cận nào là tốt nhất?
A. Viết các quy tắc CSS riêng biệt cho từng nút và hộp kiểm.
B. Sử dụng bộ chọn input để định kiểu cho tất cả.
C. Sử dụng JavaScript để thay đổi màu nền một cách linh hoạt.
D. Sử dụng bộ chọn theo thuộc tính [type="radio"] và [type="checkbox"].
Câu 19: Để tạo và định kiểu cho một biểu mẫu đăng nhập gồm các thành phần: Hai văn bản để nhập Tên tài khoản và Mật khẩu; Một hộp kiểm “Ghi nhớ thông tin đăng nhập”; Một nút nhấn “Đăng nhập”; Một đường liên kết “Quên mật khẩu”.
A. Sử dụng <input type="text">, <input type="password">, <button>.
B. Sử dụng <input type="text">, <input type="checkbox">, <button>.
C. Sử dụng tất cả các thẻ trên một cách phù hợp.
D. Sử dụng <input type="password">, <input type="checkbox">, <button>, <a>.
Câu 20: Để thêm các biểu tượng vào hộp văn bản, kỹ thuật nào thường được sử dụng?
A. Sử dụng CSS với thuộc tính background-image và padding.
B. Sử dụng thuộc tính icon trong thẻ <input>.
C. Sử dụng thẻ <img> lồng bên trong thẻ <input>.
D. Sử dụng mã JavaScript để vẽ các biểu tượng.
Câu 21: Theo mục tiêu của bài học, sau khi hoàn thành, học sinh cần có khả năng thực hiện được công việc gì?
A. Tạo ra các biểu mẫu bằng HTML.
B. Hiểu được các thuộc tính CSS cơ bản.
C. Thực hiện được việc định kiểu CSS cho biểu mẫu.
D. Định kiểu cho các hộp văn bản.
Câu 22: Tại sao việc định kiểu cho trạng thái :focus lại quan trọng đối với khả năng truy cập của trang web?
A. Giúp người dùng biết được họ đã nháy vào đâu.
B. Làm cho biểu mẫu trông đẹp mắt và hiện đại hơn.
C. Giúp tăng tốc độ nhập liệu cho người dùng.
D. Giúp người dùng bàn phím xác định được vị trí.
Câu 23: Vùng chọn input[type="text"] sẽ áp dụng kiểu cho những phần tử nào?
A. Tất cả các phần tử <input> trong biểu mẫu.
B. Tất cả các phần tử <input> có type="text".
C. Tất cả các phần tử có thuộc tính type="text".
D. Phần tử <input> đầu tiên có type="text".
Câu 24: Một nhà thiết kế muốn tạo một nút nhấn có nền màu xanh, chữ màu trắng, và bo tròn các góc. Các thuộc tính nào cần được kết hợp?
A. background-color, color, border-radius.
B. background-color, color, corner-radius.
C. background, text-color, border-radius.
D. color, background-color, border-style.
Câu 25: Sự khác biệt chính giữa việc sử dụng border và outline là gì?
A. border có thể bo tròn, outline không thể.
B. border có nhiều kiểu hơn outline.
C. border chiếm không gian, outline không chiếm.
D. border có thể có màu, outline không thể.
Câu 26: Để tạo một hiệu ứng chuyển tiếp mượt mà khi một nút nhấn đổi màu lúc di chuột qua, thuộc tính CSS nào cần được thêm vào?
A. animation.
B. transform
C. transition.
D. keyframes.
Câu 27: Một học sinh muốn tất cả các nhãn (<label>) trong biểu mẫu đều được in đậm. Đoạn mã CSS nào sau đây là đúng?
A. label { text-style: bold; }.
B. label { font-style: bold; }.
C. label { text-decoration: bold; }.
D. label { font-weight: bold; }.
Câu 28: Để định kiểu cho một hộp <textarea> không cho phép người dùng thay đổi kích thước, thuộc tính nào được sử dụng?
A. resize: disabled;.
B. resize: none;.
C. resize: fixed;.
D. resize: off;.
Câu 29: Một trong những lợi ích chính của việc sử dụng CSS để định kiểu biểu mẫu là gì?
A. Tạo ra sự nhất quán về hình thức trên toàn bộ trang web.
B. Giúp tăng số lượng người dùng truy cập trang web.
C. Giúp trang web được xếp hạng cao hơn trên công cụ tìm kiếm.
D. Giúp giảm thiểu lỗi nhập liệu từ phía người dùng.
Câu 30: Một nhà thiết kế muốn làm cho các hộp văn bản có đường viền màu xanh khi được :focus. Đoạn mã nào sau đây là đúng?
A. input:focus { border-color: blue; }.
B. input[type="text"]:focus { border: 2px solid blue; }.
C. input:focus { outline-color: blue; }.
D. Tất cả các phương án trên đều có thể đúng.
