Trắc nghiệm Tin học 12 Cánh diều Bài 8: Làm quen với CSS - Đề 01 bao gồm nhiều câu hỏi hay, bám sát chương trình. Cùng làm bài tập trắc nghiệm ngay.
Câu 1: CSS (Cascading Style Sheets) đóng vai trò chính gì trong việc phát triển trang web?
- A. Tạo cấu trúc nội dung cho trang web.
- B. Định dạng và trình bày bố cục cho trang web.
- C. Xử lý các tương tác động của người dùng.
- D. Lưu trữ dữ liệu của trang web.
Câu 2: Xét đoạn mã HTML đơn giản sau: `<h1>Chào mừng</h1>`. Nếu bạn muốn thay đổi màu chữ của tiêu đề này thành màu xanh, bạn sẽ sử dụng thuộc tính CSS nào?
- A. background-color
- B. text-color
- C. color
- D. font-color
Câu 3: Đâu là cú pháp CSS cơ bản để áp dụng một quy tắc định dạng?
- A. selector { property: value; }
- B. property: value; (selector)
- C. { selector: property; value; }
- D. selector = property: value;
Câu 4: Bạn muốn tất cả các đoạn văn (`<p>`) trên trang web của mình có cỡ chữ là 16 pixel. Quy tắc CSS nào sau đây sẽ thực hiện điều đó?
- A. p { text-size: 16px; }
- B. <p> { font-size: 16px; }
- C. paragraph { size: 16px; }
- D. p { font-size: 16px; }
Câu 5: Để nhúng mã CSS trực tiếp vào phần `<head>` của tài liệu HTML, bạn sử dụng cặp thẻ nào?
- A. <css> </css>
- B. <style> </style>
- C. <script> </script>
- D. <link> </link>
Câu 6: Phương pháp nào giúp áp dụng cùng một bộ quy tắc CSS cho nhiều trang HTML khác nhau một cách hiệu quả nhất?
- A. Sử dụng tệp CSS ngoài và liên kết bằng thẻ `<link>`.
- B. Nhúng mã CSS trực tiếp vào từng thẻ HTML bằng thuộc tính `style`.
- C. Đặt mã CSS vào thẻ `<style>` trong phần `<head>` của mỗi trang.
- D. Sao chép và dán mã CSS vào cuối phần `<body>` của mỗi trang.
Câu 7: Trong quy tắc CSS `h1 { color: blue; font-size: 24px; }`, phần `h1` được gọi là gì?
- A. Thuộc tính (Property)
- B. Giá trị (Value)
- C. Khai báo (Declaration)
- D. Bộ chọn (Selector)
Câu 8: Để đặt màu nền cho một phần tử HTML, bạn sử dụng thuộc tính CSS nào?
- A. background-color
- B. color
- C. text-background
- D. bgcolor
Câu 9: Xem xét đoạn mã CSS sau: `p { border-style: solid; border-color: red; border-width: 2px; }`. Đoạn mã này sẽ áp dụng hiệu ứng gì cho tất cả các thẻ `<p>`?
- A. Chữ màu đỏ với gạch chân.
- B. Nền màu đỏ với đường viền 2px.
- C. Đường viền liền nét màu đỏ dày 2px xung quanh phần tử.
- D. Đường viền chấm chấm màu đỏ dày 2px xung quanh phần tử.
Câu 10: Đơn vị đo lường nào sau đây thường được sử dụng để xác định kích thước của các thành phần trên màn hình, chẳng hạn như cỡ chữ hoặc độ rộng đường viền?
- A. cm (centimeters)
- B. px (pixels)
- C. kg (kilograms)
- D. m (meters)
Câu 11: Bạn muốn tất cả các tiêu đề cấp 2 (`<h2>`) trên trang web của mình có phông chữ là "Arial". Quy tắc CSS nào sau đây là đúng?
- A. h2 { font-family: Arial; }
- B. h2 { text-font: Arial; }
- C. <h2> { font-family: Arial; }
- D. h2 { typeface: Arial; }
Câu 12: Điều gì xảy ra nếu bạn khai báo nhiều thuộc tính trong cùng một khối khai báo CSS, ví dụ: `selector { property1: value1; property2: value2; }`?
- A. Chỉ thuộc tính đầu tiên được áp dụng.
- B. Chỉ thuộc tính cuối cùng được áp dụng.
- C. Gây ra lỗi cú pháp và không có thuộc tính nào được áp dụng.
- D. Tất cả các thuộc tính đều được áp dụng cho bộ chọn đó.
Câu 13: Xem xét đoạn mã HTML và CSS sau. Kết quả hiển thị của thẻ `<p>` sẽ như thế nào?
HTML: `<p>Đây là một đoạn văn.</p>`
CSS: `p { color: green; background-color: yellow; }`
- A. Chữ màu vàng trên nền màu xanh.
- B. Chữ màu xanh trên nền màu vàng.
- C. Chữ màu xanh và không có màu nền.
- D. Chữ màu vàng và không có màu nền.
Câu 14: Mục đích chính của việc tách CSS ra khỏi HTML là gì?
- A. Để tăng tốc độ tải trang web.
- B. Để làm cho mã HTML phức tạp hơn.
- C. Để dễ dàng quản lý, cập nhật định dạng và tái sử dụng mã CSS trên nhiều trang.
- D. Để giảm số lượng tệp cần thiết cho một trang web.
Câu 15: Đâu là cách phổ biến nhất và được khuyến nghị để liên kết tệp CSS ngoài (`style.css`) với tài liệu HTML?
- A. `<link rel=
- B. `<style src=
- C. `<css href=
- D. `<script src=
Câu 16: Bạn áp dụng quy tắc CSS `h1 { color: red; }` và sau đó quy tắc `h1 { color: blue; }` cho cùng một tài liệu HTML. Tiêu đề `<h1>` sẽ có màu gì?
- A. Màu đỏ.
- B. Màu xanh.
- C. Màu tím (kết hợp đỏ và xanh).
- D. Không màu (lỗi).
Câu 17: Xem xét đoạn mã HTML sau:
```html
<!DOCTYPE html>
<html>
<head>
<title>Ví dụ CSS</title>
<style>
p { font-size: 18px; }
</style>
</head>
<body>
<p>Đoạn văn thứ nhất.</p>
<p>Đoạn văn thứ hai.</p>
</body>
</html>
```
Các đoạn văn sẽ hiển thị với cỡ chữ là bao nhiêu?
- A. Mặc định của trình duyệt.
- B. 16px.
- C. 18px.
- D. Không xác định được.
Câu 18: Thuộc tính `border-style` có thể nhận giá trị nào để tạo đường viền là các dấu chấm liền nhau?
- A. dotted
- B. dashed
- C. solid
- D. double
Câu 19: Bạn muốn một đường viền màu xanh lá cây xung quanh tất cả các ảnh (`<img>`). Thuộc tính nào sau đây KHÔNG cần thiết để tạo ra đường viền này?
- A. border-style
- B. border-color
- C. border-width
- D. color
Câu 20: Nếu bạn sử dụng thuộc tính `font-size: 120%;` cho một đoạn văn, điều đó có nghĩa là kích thước chữ sẽ như thế nào so với kích thước chữ mặc định của phần tử cha hoặc của trình duyệt?
- A. Nhỏ hơn 120 pixel.
- B. Chính xác là 120 pixel.
- C. Lớn hơn 20% so với kích thước gốc.
- D. Nhỏ hơn 20% so với kích thước gốc.
Câu 21: Đâu là cách viết KHÔNG đúng cú pháp của một quy tắc CSS?
- A. h1 { color: blue; }
- B. p ( font-size: 14px )
- C. body { background-color: lightgray; }
- D. img { border-style: solid; border-width: 1px; }
Câu 22: Bạn muốn tất cả các liên kết (`<a>`) trên trang web không có gạch chân. Thuộc tính CSS nào được sử dụng để kiểm soát việc trang trí văn bản (như gạch chân)?
- A. text-decoration
- B. font-decoration
- C. text-style
- D. underline
Câu 23: Giả sử bạn có một tệp HTML và một tệp CSS ngoài. Để trình duyệt áp dụng các kiểu định dạng từ tệp CSS đó, bạn cần đặt thẻ `<link>` ở đâu trong tệp HTML?
- A. Trong phần `<head>`.
- B. Trong phần `<body>`.
- C. Sau thẻ `</html>`.
- D. Bất kỳ đâu trong tài liệu.
Câu 24: Trong đoạn mã CSS `p { color: #336699; }`, `#336699` là cách biểu diễn màu sắc dưới dạng nào?
- A. Tên màu (Named color).
- B. Mã Hexadecimal.
- C. Giá trị RGB.
- D. Giá trị HSL.
Câu 25: Bạn muốn tất cả các danh sách không có thứ tự (`<ul>`) có dấu đầu dòng hình vuông thay vì hình tròn mặc định. Thuộc tính CSS nào được sử dụng để thay đổi kiểu dấu đầu dòng?
- A. list-type
- B. marker-style
- C. list-style-type
- D. bullet-style
Câu 26: Xem xét đoạn mã HTML và CSS sau. Thẻ `<p>` sẽ có màu chữ gì?
HTML: `<p style=
- A. Màu xanh.
- B. Màu mặc định của trình duyệt.
- C. Màu xanh và màu cam xen kẽ.
- D. Màu cam.
Câu 27: Thuộc tính `border-width` có thể nhận giá trị nào để xác định độ dày của đường viền?
- A. 5px
- B. solid
- C. red
- D. center
Câu 28: Mục đích của việc sử dụng chú thích trong mã CSS (`/* ... */`) là gì?
- A. Để tạo hiệu ứng động cho trang web.
- B. Để khai báo biến trong CSS.
- C. Để giải thích mã CSS hoặc vô hiệu hóa tạm thời một phần mã.
- D. Để liên kết tệp CSS với HTML.
Câu 29: Bạn muốn đặt màu nền là màu xám nhạt cho toàn bộ trang web. Bộ chọn nào sau đây là phù hợp nhất để áp dụng quy tắc này?
- A. p
- B. body
- C. h1
- D. div
Câu 30: Đâu là lợi ích chính của việc sử dụng CSS ngoài (external CSS) so với CSS nội bộ (internal CSS) và CSS nội dòng (inline CSS)?
- A. Cho phép định dạng thống nhất nhiều trang web chỉ bằng cách chỉnh sửa một tệp CSS.
- B. Có độ ưu tiên cao nhất, đảm bảo quy tắc được áp dụng.
- C. Làm cho tệp HTML hoàn toàn độc lập, không cần tệp CSS.
- D. Tăng tốc độ tải trang cho lần truy cập đầu tiên.
