[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
1. Khi xem trước trang web, nếu một hình ảnh không hiển thị, thuộc tính HTML nào nên được kiểm tra đầu tiên để xác định nguyên nhân?
A. `alt`
B. `src`
C. `width`
D. `height`
2. Yếu tố nào quyết định cách các phần tử trên trang web được sắp xếp và định vị trên màn hình?
A. Chỉ có nội dung HTML.
B. Sử dụng CSS để định nghĩa bố cục (layout) và thuộc tính định vị (positioning).
C. Chỉ dùng JavaScript.
D. Màu sắc và font chữ.
3. Khi thiết kế một nút bấm, bạn muốn nó có viền bo tròn. Thuộc tính CSS nào bạn sẽ sử dụng?
A. `border-radius`
B. `margin`
C. `padding`
D. `border-style`
4. Trong quá trình xem trước trang web, làm thế nào để kiểm tra xem trang web có hiển thị tốt trên các thiết bị di động hay không?
A. Chỉ kiểm tra trên một máy tính để bàn.
B. Sử dụng tính năng Developer Tools trong trình duyệt để mô phỏng các thiết bị khác nhau.
C. In toàn bộ trang web ra giấy.
D. Yêu cầu người dùng khác kiểm tra trên điện thoại của họ.
5. Thẻ HTML nào được sử dụng để nhúng một tệp CSS từ bên ngoài vào trang web?
A. `
Thuộc tính `src` (source) trong thẻ `
![]()
` chỉ định đường dẫn đến tệp hình ảnh. Nếu đường dẫn này sai hoặc tệp không tồn tại, hình ảnh sẽ không hiển thị. Thuộc tính `alt` cung cấp văn bản thay thế, quan trọng cho khả năng tiếp cận nhưng không trực tiếp gây ra lỗi hiển thị ảnh. Kết luận Lý giải: Thuộc tính `src` chỉ định đường dẫn tệp ảnh, cần kiểm tra khi ảnh không hiển thị.
2 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
2. Yếu tố nào quyết định cách các phần tử trên trang web được sắp xếp và định vị trên màn hình?
CSS cung cấp các thuộc tính mạnh mẽ như `display` (flexbox, grid), `position`, `float`, `margin`, `padding` để kiểm soát cách các phần tử được sắp xếp, định vị và căn chỉnh trên trang. Kết luận Lý giải: CSS dùng để định nghĩa bố cục và định vị phần tử.
3 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
3. Khi thiết kế một nút bấm, bạn muốn nó có viền bo tròn. Thuộc tính CSS nào bạn sẽ sử dụng?
Thuộc tính `border-radius` trong CSS dùng để tạo các góc bo tròn cho một phần tử, bao gồm cả viền của nút bấm. Kết luận Lý giải: `border-radius` tạo viền bo tròn cho phần tử.
4 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
4. Trong quá trình xem trước trang web, làm thế nào để kiểm tra xem trang web có hiển thị tốt trên các thiết bị di động hay không?
Các trình duyệt hiện đại như Chrome, Firefox, Edge đều có công cụ dành cho nhà phát triển (Developer Tools) cho phép mô phỏng hiển thị trang web trên nhiều kích thước màn hình và loại thiết bị khác nhau, giúp kiểm tra tính đáp ứng. Kết luận Lý giải: Developer Tools giúp mô phỏng hiển thị trên nhiều thiết bị.
5 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
5. Thẻ HTML nào được sử dụng để nhúng một tệp CSS từ bên ngoài vào trang web?
6 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
6. Khi thiết kế giao diện, bạn muốn tất cả các đoạn văn bản trên trang có màu xanh dương. Phương án CSS nào hiệu quả nhất để đạt được điều này?
Việc định nghĩa một quy tắc CSS chung cho thẻ `p` với thuộc tính `color: blue;` sẽ áp dụng màu xanh dương cho tất cả các đoạn văn bản trên trang một cách hiệu quả và dễ bảo trì. Sử dụng inline style cho từng thẻ sẽ rất thủ công và khó quản lý. Kết luận Lý giải: Quy tắc CSS chung cho thẻ `p` là hiệu quả nhất.
7 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
7. Khi thiết lập giao diện cho một trang web, việc sử dụng các thẻ HTML hợp lệ và có ý nghĩa (semantic HTML) mang lại lợi ích gì?
Semantic HTML sử dụng các thẻ có ý nghĩa rõ ràng (ví dụ: header, nav, main, article) giúp trình duyệt, công cụ tìm kiếm và các thiết bị hỗ trợ hiểu cấu trúc trang web tốt hơn, cải thiện khả năng tiếp cận và SEO. Kết luận Lý giải: Semantic HTML tăng cường khả năng tiếp cận và SEO.
8 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
8. Trong HTML, thẻ nào được sử dụng để tạo một tiêu đề cấp cao nhất cho trang web?
Các thẻ từ `
` đến `` được sử dụng để định nghĩa các cấp độ tiêu đề. `` là cấp độ cao nhất, thường được sử dụng cho tiêu đề chính của trang, trong khi `` là cấp độ thấp nhất. Thẻ `` xác định tiêu đề hiển thị trên thanh tiêu đề của trình duyệt hoặc tab. Kết luận Lý giải: `` là thẻ tạo tiêu đề cấp cao nhất.
9 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
9. Trong HTML, thẻ nào được sử dụng để tạo một danh sách không có thứ tự (unordered list)?
Thẻ `
` (unordered list) được sử dụng để tạo danh sách các mục, mỗi mục được bao bọc bởi thẻ `- ` (list item), và hiển thị dưới dạng các dấu đầu dòng. Kết luận Lý giải: Thẻ `
` tạo danh sách không có thứ tự.
10 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
10. Ngôn ngữ nào chủ yếu được sử dụng để định nghĩa cấu trúc và nội dung của một trang web?
HTML là ngôn ngữ đánh dấu cơ bản để tạo ra cấu trúc và nội dung của các trang web, bao gồm văn bản, hình ảnh, liên kết. Kết luận Lý giải: HTML được sử dụng để định nghĩa cấu trúc và nội dung trang web.
11 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
11. Trong quá trình tạo trang web, yếu tố nào đóng vai trò quan trọng nhất trong việc định hình trải nghiệm người dùng và truyền tải thông điệp của trang web?
Theo các nguyên tắc thiết kế web phổ biến, việc thiết lập giao diện ảnh hưởng trực tiếp đến cách người dùng cảm nhận và tương tác với trang web, quyết định sự thu hút và hiệu quả truyền tải thông điệp. Kết luận Lý giải: Thiết lập giao diện ảnh hưởng trực tiếp đến trải nghiệm người dùng và truyền tải thông điệp.
12 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
12. Đâu là mục đích chính của việc sử dụng thuộc tính `id` trong HTML?
Thuộc tính `id` gán một định danh duy nhất cho một phần tử HTML. Điều này cho phép CSS áp dụng kiểu dáng cụ thể hoặc JavaScript truy cập và thao tác với phần tử đó một cách chính xác. Kết luận Lý giải: `id` xác định duy nhất một phần tử cho CSS/JavaScript.
13 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
13. Trong quá trình tạo trang web, việc xem trước (preview) giúp ích gì cho nhà phát triển?
Xem trước là bước thiết yếu để nhà phát triển có thể nhìn thấy trang web hoạt động như thế nào trong môi trường thực tế (trình duyệt), phát hiện các lỗi về bố cục, kiểu dáng, tương tác và thực hiện các điều chỉnh cần thiết để đạt được kết quả mong muốn. Kết luận Lý giải: Xem trước giúp kiểm tra trực quan, phát hiện lỗi và điều chỉnh kịp thời.
14 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
14. Tại sao việc sử dụng các đơn vị tương đối (như % hoặc em) trong CSS lại quan trọng cho việc thiết kế web đáp ứng (responsive design)?
Đơn vị tương đối như phần trăm (%) hoặc em cho phép các phần tử như chiều rộng, chiều cao, khoảng cách tự động thay đổi kích thước dựa trên kích thước của phần tử cha hoặc kích thước font, giúp trang web hiển thị tốt trên nhiều loại thiết bị. Kết luận Lý giải: Đơn vị tương đối giúp phần tử điều chỉnh kích thước theo màn hình.
15 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
15. Trong HTML, thẻ nào được sử dụng để tạo một liên kết đến một trang web khác hoặc một phần khác của cùng một trang?
16 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
16. CSS được sử dụng để làm gì trong việc phát triển trang web?
CSS (Cascading Style Sheets) là ngôn ngữ được dùng để mô tả cách trình bày các tài liệu viết bằng ngôn ngữ đánh dấu như HTML, bao gồm bố cục, màu sắc, font chữ, v.v. Kết luận Lý giải: CSS dùng để định dạng và trình bày giao diện.
17 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
17. Thuộc tính CSS nào dùng để thay đổi kiểu hiển thị của một phần tử thành dạng khối (block) hay nội tuyến (inline)?
Thuộc tính `display` trong CSS cho phép bạn thay đổi cách một phần tử được hiển thị, với các giá trị phổ biến như `block` (chiếm toàn bộ chiều rộng, xuống dòng mới), `inline` (chỉ chiếm không gian cần thiết, nằm trên cùng dòng), `inline-block`, `flex`, `grid`. Kết luận Lý giải: Thuộc tính `display` thay đổi kiểu hiển thị của phần tử.
18 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
18. Trong quá trình thiết lập giao diện, làm thế nào để bạn đảm bảo rằng trang web sẽ có giao diện tốt trên cả máy tính và thiết bị di động?
Responsive Web Design (Thiết kế web đáp ứng) là phương pháp sử dụng các kỹ thuật như CSS Media Queries, đơn vị tương đối để trang web tự động điều chỉnh bố cục và hiển thị phù hợp với kích thước màn hình của thiết bị. Kết luận Lý giải: Responsive Web Design với Media Queries đảm bảo hiển thị tốt trên mọi thiết bị.
19 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
19. Đâu là một phương pháp tốt để tổ chức các file CSS trong một dự án web lớn?
Việc chia nhỏ mã CSS thành các file riêng biệt giúp quản lý, bảo trì và tái sử dụng mã dễ dàng hơn, đặc biệt trong các dự án lớn. Kết luận Lý giải: Chia nhỏ CSS thành các file riêng biệt giúp quản lý dễ dàng hơn.
20 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
20. Thuộc tính CSS nào được sử dụng để thêm khoảng cách giữa nội dung của một phần tử và viền của nó?
Thuộc tính `padding` trong CSS tạo ra khoảng trống bên trong đường viền của một phần tử, giữa nội dung và viền. `margin` tạo khoảng trống bên ngoài viền. Kết luận Lý giải: `padding` tạo khoảng cách giữa nội dung và viền.
21 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
21. Khi thiết kế giao diện, bạn muốn tạo một hiệu ứng chuyển đổi mượt mà khi thay đổi một thuộc tính CSS (ví dụ: màu nền, kích thước). Bạn nên sử dụng thuộc tính CSS nào?
Thuộc tính `transition` trong CSS cho phép bạn xác định thời gian và cách thức mà một thuộc tính CSS thay đổi từ trạng thái này sang trạng thái khác một cách mượt mà, ví dụ như khi di chuột qua một phần tử. `animation` phức tạp hơn và dùng cho các chuỗi hiệu ứng. `transform` dùng để biến đổi hình học. `transition-delay` chỉ là một phần của `transition`. Kết luận Lý giải: `transition` tạo hiệu ứng chuyển đổi mượt mà cho thuộc tính CSS.
22 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
22. Khi thiết kế một nút bấm trên trang web, thuộc tính CSS nào thường được sử dụng để thay đổi màu nền của nút khi người dùng di chuột qua?
Thuộc tính `background-color` trong CSS được sử dụng để đặt màu nền cho một phần tử, bao gồm cả nút bấm, và có thể kết hợp với giả lớp `:hover` để thay đổi màu sắc khi di chuột qua. Kết luận Lý giải: `background-color` dùng để thay đổi màu nền khi di chuột qua.
23 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
23. Yếu tố nào sau đây KHÔNG thuộc về việc thiết lập giao diện trang web?
Cấu trúc liên kết giữa các trang (sitemap, navigation) chủ yếu liên quan đến kiến trúc thông tin và điều hướng, mặc dù nó ảnh hưởng đến trải nghiệm người dùng nhưng không trực tiếp là phần của thiết lập giao diện theo nghĩa trình bày hình ảnh. Kết luận Lý giải: Cấu trúc liên kết không phải là thiết lập giao diện.
24 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
24. Công cụ nào thường được sử dụng để xem trước trực tiếp các thay đổi trong quá trình thiết kế và phát triển giao diện web?
Trình duyệt web là công cụ chính để hiển thị và xem trước kết quả của các trang web được tạo bằng HTML, CSS và JavaScript. Kết luận Lý giải: Trình duyệt web dùng để xem trước giao diện trang web.
25 / 25
Category:
[Chân trời] Trắc nghiệm Tin học ứng dụng 12 bài E1: Tạo trang web, thiết lập giao diện và xem trước trang web
Tags:
Bộ đề 1
25. Bạn muốn tạo một phần tử có thể định vị tự do trên trang web, độc lập với luồng văn bản thông thường. Bạn nên sử dụng giá trị nào cho thuộc tính `position` trong CSS?
Khi đặt `position` là `absolute`, phần tử sẽ được định vị tương đối với phần tử cha có thuộc tính `position` không phải là `static` (hoặc đối với viewport nếu không có phần tử cha nào như vậy), cho phép định vị tự do bằng các thuộc tính `top`, `bottom`, `left`, `right`. Giá trị `fixed` cũng định vị tự do nhưng luôn cố định theo viewport. Kết luận Lý giải: `position: absolute;` cho phép định vị tự do.