Bài tập củng cố Khoa học máy tính 12 kết nối: bài 13 Khái niệm, vai trò của CSS

Bài tập củng cố môn Tin học 12 - Khoa học máy tính kết nối tri thức: Bài 13 Khái niệm, vai trò của CSS. Phần bài tập gồm 4 mức độ: Nhận biết, Thông hiểu, Vận dụng và Vận dụng cao bám sát với chương trình sách giáo khoa. Thông qua bài tập này, học sinh có thể ôn luyện kiến thức đã học từ cơ bản đến nâng cao.

Nội dung chi tiết

BÀI 13: KHÁI NIỆM, VAI TRÒ CỦA CSS

1. NHẬN BIẾT (4 CÂU)

Câu 1: CSS là viết tắt của cụm từ gì? Nêu khái niệm của CSS.

Trả lời:

CSS là viết tắt của Cascading Style Sheets. CSS là định dạng độc lập với HTML, được dùng để thiết lập các mẫu định dạng cho trang web.

Câu 2: Hãy liệt kê ba cách thiết lập CSS.

Trả lời:

Ba cách thiết lập CSS là:

CSS trong (Internal CSS).

CSS ngoài (External CSS).

CSS nội tuyến (Inline CSS).

Câu 3: Bộ chọn và vùng mô tả trong CSS là gì?

Trả lời:

Bộ chọn (Selector) xác định các phần tử HTML được áp dụng định dạng.

Vùng mô tả (Declaration Block) chứa các quy định định dạng với cấu trúc {thuộc tính: giá trị;

Câu 4: Nêu vai trò của thuộc tính style trong thiết lập CSS nội tuyến.

Trả lời:

Thuộc tính style trong CSS nội tuyến được sử dụng để định dạng CSS trực tiếp bên trong thẻ HTML.

2. THÔNG HIỂU (4 CÂU)

Câu 1: Tại sao CSS được coi là một công cụ hiệu quả trong việc định dạng trang web?

Trả lời:

CSS cho phép tách biệt nội dung HTML và định dạng trang web. Các mẫu CSS có thể sử dụng lại nhiều lần, giúp định dạng nhanh chóng, đồng nhất và tiết kiệm thời gian.

Câu 2: Phân biệt giữa CSS trong và CSS ngoài.

Trả lời:

CSS trong: Định dạng CSS viết trong thẻ <style> và đặt trong phần <head> của tệp HTML. Chỉ áp dụng cho trang hiện tại.

CSS ngoài: Định dạng CSS được viết trong một tệp .css riêng và kết nối với tệp HTML. Có thể áp dụng cho nhiều trang web.

Câu 3: Giải thích cấu trúc tổng quát của CSS với ví dụ đơn giản.

Trả lời:

Cấu trúc tổng quát của CSS: bộ chọn { thuộc tính: giá trị; }.

VD:

p { color: blue; text-align: center; }

Câu 4: Vì sao việc sử dụng CSS ngoài lại thuận tiện hơn so với CSS trong?

Trả lời:

CSS ngoài giúp áp dụng một tệp CSS cho nhiều trang web, tạo sự đồng nhất và tiết kiệm thời gian chỉnh sửa chỉ bằng cách thay đổi một lần trong tệp CSS.

3. VẬN DỤNG (3 CÂU)

Câu 1: Viết đoạn CSS nội tuyến để thiết lập màu chữ đỏ và cỡ chữ 18px cho đoạn văn bản.

Trả lời:

Câu 2: Viết đoạn CSS trong để thiết lập màu nền vàng và căn lề trái cho tất cả các thẻ <h1> trên trang.

Trả lời:

<style>

h1 { background-color: yellow; text-align: left; }

</style>

Câu 3: Viết đoạn mã CSS ngoài để thiết lập màu chữ xanh cho tất cả các thẻ <p> và màu chữ đỏ cho thẻ <h2>.

Trả lời:

p { color: blue; }

h2 { color: red; }

4. VẬN DỤNG CAO (2 CÂU)

Câu 1: Phân tích ưu và nhược điểm của việc sử dụng CSS nội tuyến.

Trả lời:

Ưu điểm: Định dạng nhanh cho một phần tử cụ thể, không cần file CSS riêng.

Nhược điểm: Khó bảo trì, tốn thời gian nếu cần chỉnh sửa nhiều phần tử. Không phù hợp cho định dạng toàn bộ trang web.

Câu 2: Thiết kế một đoạn mã HTML kết hợp CSS ngoài để tạo trang web có tiêu đề chữ đỏ, đoạn văn chữ xanh, và nền trang màu xám nhạt.

Trả lời:

Tệp styles.css:

body { background-color: #f0f0f0; }

h1 { color: red; }

p { color: blue; }

Tệp HTML:

<!DOCTYPE html>

<head>

<title>Trang CSS Mẫu</title>

</head>

<body>

</body>

</html>