Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
1. Trong JavaScript, phương thức DOM nào thường được sử dụng để tìm một phần tử HTML dựa trên ID của nó?
A. querySelector()
B. getElementsByTagName()
C. getElementsByClassName()
D. getElementById()
2. Khi tạo một băng chuyền ảnh bằng cách di chuyển một tập hợp các ảnh được đặt cạnh nhau, thuộc tính CSS nào giúp ngăn các ảnh vượt ra khỏi vùng chứa của nó?
A. overflow: visible;
B. overflow: scroll;
C. overflow: hidden;
D. overflow: auto;
3. Khi tạo băng chuyền hình ảnh, việc sử dụng CSS để làm cho ảnh responsive (thích ứng) có nghĩa là gì?
A. Hình ảnh sẽ tự động thay đổi định dạng file để tải nhanh hơn.
B. Hình ảnh sẽ tự động thay đổi kích thước để phù hợp với các kích thước màn hình khác nhau.
C. Hình ảnh chỉ hiển thị trên các thiết bị có màn hình lớn.
D. Hình ảnh sẽ chỉ tải khi người dùng nhấp vào nó.
4. Trong bài E5, việc nhúng mã có thể bao gồm việc sử dụng các thẻ HTML để định dạng văn bản xung quanh băng chuyền hình ảnh. Thẻ nào thường dùng để tạo đoạn văn bản?
5. Trong bài E5, việc nhúng mã có thể liên quan đến việc sử dụng các thuộc tính cho thẻ a (anchor). Thuộc tính nào là bắt buộc để thẻ a hoạt động như một liên kết?
A. name
B. target
C. href
D. title
6. Trong HTML, thẻ nào được sử dụng phổ biến nhất để tạo một danh sách các liên kết điều hướng hoặc các mục trong băng chuyền hình ảnh?
7. Nếu bạn muốn mỗi hình ảnh trong băng chuyền có cùng chiều cao nhưng chiều rộng khác nhau, bạn sẽ cấu hình CSS như thế nào cho các thẻ img bên trong?
A. height: auto; width: 100%;
B. height: 200px; width: auto;
C. height: 100%; width: 100%;
D. height: auto; width: auto;
8. Tại sao việc sử dụng các thẻ ngữ nghĩa (semantic tags) như figure và figcaption lại quan trọng khi nhúng hình ảnh và chú thích trong một trang web?
A. Để tăng tốc độ tải trang bằng cách giảm số lượng thẻ.
B. Để cải thiện SEO và khả năng truy cập, giúp công cụ tìm kiếm và trình đọc màn hình hiểu rõ hơn về nội dung.
C. Để tạo hiệu ứng chuyển động mượt mà cho hình ảnh.
D. Để chỉ định kích thước cố định cho hình ảnh trên mọi thiết bị.
9. Trong HTML, thuộc tính src của thẻ img có vai trò gì?
A. Cung cấp văn bản thay thế cho hình ảnh.
B. Xác định vị trí và tên tệp tin của hình ảnh cần hiển thị.
C. Thiết lập kích thước chiều rộng và chiều cao cho hình ảnh.
D. Liên kết hình ảnh với một URL khác.
10. Khi nhúng một đoạn mã JavaScript vào trang HTML để điều khiển băng chuyền hình ảnh, vị trí tốt nhất để đặt thẻ
Phương thức getElementById() là cách trực tiếp và hiệu quả nhất để truy cập một phần tử duy nhất có ID cụ thể trong tài liệu HTML. Kết luận Lý giải: getElementById() dùng để truy cập phần tử theo ID.
2 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
2. Khi tạo một băng chuyền ảnh bằng cách di chuyển một tập hợp các ảnh được đặt cạnh nhau, thuộc tính CSS nào giúp ngăn các ảnh vượt ra khỏi vùng chứa của nó?
Thuộc tính overflow: hidden; sẽ cắt bỏ bất kỳ nội dung nào của phần tử cha mà vượt ra ngoài các cạnh của nó, giữ cho bố cục gọn gàng. Kết luận Lý giải: overflow: hidden; ẩn các phần tử vượt ra ngoài vùng chứa.
3 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
3. Khi tạo băng chuyền hình ảnh, việc sử dụng CSS để làm cho ảnh responsive (thích ứng) có nghĩa là gì?
Thiết kế responsive với CSS đảm bảo hình ảnh có thể co giãn và điều chỉnh kích thước để hiển thị tốt trên mọi loại thiết bị, từ điện thoại di động đến máy tính để bàn. Kết luận Lý giải: Ảnh responsive tự điều chỉnh kích thước theo màn hình.
5 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
5. Trong bài E5, việc nhúng mã có thể liên quan đến việc sử dụng các thuộc tính cho thẻ a (anchor). Thuộc tính nào là bắt buộc để thẻ a hoạt động như một liên kết?
Thuộc tính href (hypertext reference) của thẻ a chỉ định URL mà liên kết sẽ trỏ tới, đây là thuộc tính bắt buộc để tạo một liên kết. Kết luận Lý giải: Thuộc tính href là bắt buộc cho thẻ a.
6 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
6. Trong HTML, thẻ nào được sử dụng phổ biến nhất để tạo một danh sách các liên kết điều hướng hoặc các mục trong băng chuyền hình ảnh?
Mặc dù ul hoặc ol có thể được sử dụng để nhóm, nhưng thẻ li (list item) mới là phần tử con trực tiếp chứa mỗi mục riêng lẻ, thường là một liên kết hoặc một hình ảnh trong băng chuyền. Kết luận Lý giải: Thẻ li chứa từng mục riêng lẻ của danh sách.
7 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
7. Nếu bạn muốn mỗi hình ảnh trong băng chuyền có cùng chiều cao nhưng chiều rộng khác nhau, bạn sẽ cấu hình CSS như thế nào cho các thẻ img bên trong?
Thiết lập height: 200px; (hoặc một giá trị cố định khác) và width: auto; sẽ giữ cho chiều cao cố định và chiều rộng tự động điều chỉnh theo tỷ lệ khung hình, đảm bảo ảnh không bị méo. Kết luận Lý giải: height: 200px; width: auto; giữ chiều cao cố định và tỷ lệ ảnh.
8 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
8. Tại sao việc sử dụng các thẻ ngữ nghĩa (semantic tags) như figure và figcaption lại quan trọng khi nhúng hình ảnh và chú thích trong một trang web?
Các thẻ ngữ nghĩa như figure và figcaption cung cấp thông tin cấu trúc rõ ràng cho trình duyệt và các công nghệ hỗ trợ, giúp cải thiện SEO và khả năng truy cập. Kết luận Lý giải: Thẻ ngữ nghĩa cải thiện SEO và khả năng truy cập.
9 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
9. Trong HTML, thuộc tính src của thẻ img có vai trò gì?
Thuộc tính src (source) trong thẻ img chỉ định đường dẫn tới tệp hình ảnh để trình duyệt có thể tải và hiển thị nó. Kết luận Lý giải: Thuộc tính src chỉ định đường dẫn đến tệp hình ảnh.
10 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
10. Khi nhúng một đoạn mã JavaScript vào trang HTML để điều khiển băng chuyền hình ảnh, vị trí tốt nhất để đặt thẻ
Đặt thẻ
Các điểm điều hướng thường là các phần tử nhỏ, có thể là span hoặc div, được định dạng bằng CSS để hiển thị dưới dạng các vòng tròn hoặc dấu chấm, đại diện cho từng ảnh trong băng chuyền. Kết luận Lý giải: span hoặc div thường dùng làm điểm điều hướng.
12 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
12. Trong một cấu trúc băng chuyền hình ảnh, nếu bạn muốn các hình ảnh được sắp xếp theo chiều ngang và chỉ hiển thị một phần của ảnh, bạn có thể áp dụng thuộc tính CSS nào cho phần tử chứa chúng?
Sử dụng display: flex cùng với overflow-x: auto và white-space: nowrap cho phép các mục flex (hình ảnh) nằm trên một dòng và có thể cuộn ngang, chỉ hiển thị một phần. Kết luận Lý giải: display: flex với overflow-x: auto tạo băng chuyền ngang.
13 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
13. Khi tạo một băng chuyền hình ảnh (image carousel) bằng HTML và CSS, mục đích chính của việc sử dụng các lớp (class) CSS là gì?
Các lớp CSS cho phép nhóm các phần tử có cùng đặc điểm kiểu dáng, giúp việc quản lý và áp dụng CSS cho băng chuyền hình ảnh trở nên dễ dàng và hiệu quả hơn. Kết luận Lý giải: Lớp CSS dùng để nhóm và áp dụng kiểu dáng cho các phần tử liên quan.
14 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
14. Tại sao việc tối ưu hóa kích thước tệp hình ảnh lại quan trọng đối với băng chuyền hình ảnh?
Hình ảnh có kích thước tệp lớn sẽ làm chậm quá trình tải trang, ảnh hưởng tiêu cực đến trải nghiệm người dùng, đặc biệt trên các thiết bị di động hoặc mạng yếu. Kết luận Lý giải: Tối ưu hóa kích thước ảnh giúp giảm thời gian tải trang.
15 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
15. Để đảm bảo băng chuyền hình ảnh hoạt động tốt trên các thiết bị di động, kỹ thuật nào trong CSS là quan trọng nhất?
Sử dụng width: 100% giúp ảnh co giãn, và media queries cho phép áp dụng các quy tắc CSS khác nhau dựa trên kích thước màn hình, rất quan trọng cho thiết bị di động. Kết luận Lý giải: width: 100% và media queries là chìa khóa cho di động.
16 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
16. Trong lập trình web, thuật ngữ lazy loading (tải lười biếng) khi áp dụng cho hình ảnh trong băng chuyền có ý nghĩa gì?
Lazy loading tối ưu hóa hiệu suất bằng cách trì hoãn việc tải hình ảnh cho đến khi chúng thực sự cần thiết, tức là khi người dùng cuộn đến vị trí của chúng. Kết luận Lý giải: Lazy loading tải ảnh khi chúng xuất hiện trong khung nhìn.
17 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
17. Trong ngữ cảnh tạo băng chuyền hình ảnh, nếu bạn muốn người dùng có thể điều hướng qua các ảnh bằng cách nhấn các nút mũi tên trái/phải, bạn sẽ cần sử dụng công nghệ gì để xử lý sự kiện nhấn phím?
JavaScript là công nghệ chính để bắt và xử lý các sự kiện tương tác của người dùng như nhấn phím, cho phép điều khiển các thành phần trên trang web. Kết luận Lý giải: JavaScript xử lý sự kiện nhấn phím.
18 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
18. Khi bạn cần nhúng một đoạn mã HTML hoặc CSS vào một trang web khác mà không muốn người dùng chỉnh sửa trực tiếp, bạn thường sẽ sử dụng phương pháp nào?
Thẻ iframe cho phép nhúng một tài liệu HTML khác vào trong tài liệu hiện tại, thường được dùng để nhúng nội dung từ các nguồn bên ngoài. Kết luận Lý giải: iframe dùng để nhúng nội dung từ nguồn khác.
19 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
19. Khi cần nhúng một hình ảnh được lưu trữ trên một máy chủ khác (external image), bạn sẽ cấu hình thuộc tính nào của thẻ img?
Thuộc tính src của thẻ img chấp nhận đường dẫn tương đối hoặc URL tuyệt đối, cho phép hiển thị hình ảnh từ bất kỳ nguồn nào trên web. Kết luận Lý giải: Thuộc tính src dùng để chỉ định đường dẫn URL của hình ảnh.
20 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
20. Trong ngữ cảnh tạo băng chuyền hình ảnh, nếu muốn mỗi hình ảnh chỉ hiển thị một lần và sau đó chuyển sang ảnh tiếp theo, bạn sẽ cấu hình thuộc tính nào của trình phát đa phương tiện (nếu sử dụng) hoặc logic điều khiển (nếu dùng JavaScript/CSS)?
Để mỗi ảnh chỉ hiển thị một lần và chuyển tiếp, logic điều khiển cần được thiết lập để không lặp lại hoặc chỉ chuyển một lần theo trình tự. Kết luận Lý giải: Cấu hình chuyển tiếp một lần hoặc chế độ xem đơn là cần thiết.
21 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
21. Trong bài E5 Nhúng mã và tạo băng chuyền hình ảnh, khi sử dụng thẻ HTML img để hiển thị hình ảnh, thuộc tính nào là bắt buộc phải có để mô tả nội dung hình ảnh cho các trình đọc màn hình và trong trường hợp hình ảnh không tải được?
Theo các tiêu chuẩn về khả năng truy cập web, thuộc tính alt của thẻ img là bắt buộc để cung cấp văn bản thay thế cho hình ảnh, giúp trình đọc màn hình và các tình huống không hiển thị hình ảnh. Kết luận Lý giải: Thuộc tính alt là bắt buộc để mô tả nội dung hình ảnh.
22 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
22. Nếu bạn muốn tạo một hiệu ứng mà khi người dùng rê chuột qua một hình ảnh trong băng chuyền, hình ảnh đó sẽ phóng to nhẹ, bạn sẽ sử dụng kỹ thuật nào kết hợp với CSS?
Pseudo-class :hover kết hợp với thuộc tính transform: scale() cho phép thay đổi kích thước của phần tử khi người dùng rê chuột vào, tạo hiệu ứng phóng to. Kết luận Lý giải: :hover và transform: scale() tạo hiệu ứng phóng to khi rê chuột.
23 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
23. Để tạo hiệu ứng chuyển cảnh mượt mà giữa các hình ảnh trong băng chuyền, bạn có thể sử dụng kỹ thuật CSS nào?
CSS transition và animation cho phép định nghĩa các thay đổi về thuộc tính theo thời gian, tạo ra các hiệu ứng chuyển động mượt mà cho băng chuyền. Kết luận Lý giải: transition và animation tạo hiệu ứng chuyển cảnh mượt mà.
24 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
24. Mục đích chính của việc sử dụng thuộc tính controls trong thẻ HTML
Thuộc tính controls thêm giao diện người dùng chuẩn cho trình phát video, cho phép người xem tương tác với video. Kết luận Lý giải: Thuộc tính controls hiển thị các nút điều khiển video.
25 / 25
Category:
Trắc nghiệm Tin học ứng dụng 12 chân trời sáng tạo bài E5: Nhúng mã và tạo băng chuyền hình ảnh
Tags:
Bộ đề 1
25. Trong CSS, thuộc tính nào được sử dụng để thiết lập khoảng cách giữa các phần tử con trong một flexbox container?
Thuộc tính gap (hoặc grid-gap/row-gap/column-gap) là cách hiện đại và hiệu quả để tạo khoảng cách giữa các item trong flexbox hoặc grid layout. Kết luận Lý giải: Thuộc tính gap tạo khoảng cách giữa các item flexbox.
