Tin học 12 Bài 14: Định dạng văn bản bằng CSS Giải Tin 12 Kết nối tri thức trang 76, 77, 78, 79, 80, 81, 82

Bài trước

Mục lục

Bài sau

Giải bài tập SGK Tin học 12 trang 76, 77, 78, 79, 80, 81, 82 sách Kết nối tri thức với cuộc sống giúp các em học sinh lớp 12 xem gợi ý giải các câu hỏi Bài 14: Định dạng văn bản bằng CSS thuộc Chủ đề 4: Giải quyết vấn đề với sự trợ giúp của máy tính.

Soạn Tin học 12 Kết nối tri thức Bài 14 các em sẽ biết cách trả lời toàn bộ các câu hỏi bài học này. Đồng thời, qua tài liệu này giúp quý thầy cô tham khảo để soạn giáo án cho học sinh của mình theo chương trình mới. Vậy mời thầy cô và các em cùng theo dõi bài viết dưới đây của Download.vn:

Tin học 12 Bài 14: Định dạng văn bản bằng CSS

Giải Nội dung bài học Tin học 12 Kết nối tri thức Bài 14
- 1. Định dạng văn bản bằng CSS
- 2. Tính kế thừa và cách lựa chọn theo thứ tự của CSS
Giải Luyện tập Tin học 12 Kết nối tri thức Bài 14
- Luyện tập 1
- Luyện tập 2
Giải Vận dụng Tin học 12 Kết nối tri thức Bài 14
- Vận dụng 1
- Vận dụng 2

Giải Nội dung bài học Tin học 12 Kết nối tri thức Bài 14

1. Định dạng văn bản bằng CSS

Câu 1: Giải thích các mẫu định dạng CSS sau

Định dạng văn bản bằng CSS

Lời giải:

Trong đoạn mã CSS trên, chúng ta có hai mẫu định dạng văn bản:

- Mẫu định dạng cho tiêu đề h1:

+ color: red;: Đặt màu chữ của tiêu đề h1 thành màu đỏ.

+ text-align: center;: Căn chỉnh tiêu đề h1 ở giữa trên trang.

- Mẫu định dạng cho đoạn văn bản trong thẻ p:

+ text-align: justify;: Căn chỉnh đoạn văn bản trong thẻ p theo kiểu dàn trang đều, với cả hai mép trái và phải được căn chỉnh.

Câu 2: Giả sử mẫu định dạng CSS có định dạng sau

Định dạng văn bản bằng CSS

Hãy kiểm tra tác dụng của CSS này trên một tệp HTML bất kì và đưa ra nhận xét.

Lời giải:

Mẫu định dạng CSS sẽ áp dụng một thuộc tính cho phần tử của tệp HTML. Cụ thể là color: blue;, điều này đặt màu chữ của toàn bộ nội dung trong phần tử thành màu xanh lam.

Ví dụ:

Định dạng văn bản bằng CSS

2. Tính kế thừa và cách lựa chọn theo thứ tự của CSS

Câu 1: Giả sử có mẫu định dạng sau.

Định dạng văn bản bằng CSS

Khi đó toàn bộ văn bản của trang web sẽ mặc định thể hiện với phông có chân, đúng hay sai?

Lời giải:

Đúng, toàn bộ văn bản của trang web sẽ mặc định thể hiện với phông chân (serif) trong trường hợp này.

Câu 2: Giả sử có mẫu định dạng như sau

Định dạng văn bản bằng CSS

Mẫu nào sẽ được áp dụng cho h1, mẫu nào sẽ được áp dụng cho thẻ p.

Lời giải:

- Quy tắc body {} sẽ được áp dụng cho phần tử <body> và các phần tử con của nó, đặt phông chữ của chúng thành phông chân (sans-serif).

- Quy tắc h1 {text-align: left;} sẽ được áp dụng cho tất cả các phần tử <h1>, đặt thuộc tính text-align thành "left".

- Quy tắc h1 {text-align: center !important;} sẽ không được áp dụng đúng cú pháp CSS vì thiếu ký tự đóng ngoặc nhọn. Do đó, quy tắc này sẽ bị bỏ qua và không có tác động lên phần tử <h1>.

- Quy tắc * {} sẽ được áp dụng cho tất cả các phần tử, đặt phông chữ của chúng thành phông chân (serif).

Giải Luyện tập Tin học 12 Kết nối tri thức Bài 14

Luyện tập 1

Mỗi phông chữ sau đây thuộc loại nào

Lời giải:

a) Times New Roman b) Courier c) Abadi

a) Bradley Hand ITC e) Berlin Sans FB f) ALGERIAN

g) Consolas h) Caseadia

Luyện tập 2

Hãy liệt kê các thuộc tính CSS liên quan đến định dạng đoạn văn bản sau

Định dạng văn bản bằng CSS

Lời giải:

Các thuộc tính CSS liên quan đến định dạng đoạn văn bản: Căn đoạn văn bản, màu chữ, kiểu chữ. Cụ thể:

Định dạng văn bản bằng CSS

Giải Vận dụng Tin học 12 Kết nối tri thức Bài 14

Vận dụng 1

Tìm hiểu thêm các thuộc tính phông chữ như font-variant và thuộc tính dòng văn bản như letter-space (khoảng cách giữa các kí tự), word-space (khoảng cách các từ) và text-shadow (chữ bóng).

Lời giải:

- font-variant: Thuộc tính này được sử dụng để xác định kiểu chữ viết hoa của văn bản. Giá trị phổ biến của thuộc tính này bao gồm:

+ normal: Chữ in thường (mặc định).

+ small-caps: Chữ viết hoa nhỏ.

- letter-spacing: Thuộc tính này xác định khoảng cách giữa các kí tự trong một đoạn văn bản. Giá trị của thuộc tính này có thể là số âm (kích thước kí tự thu nhỏ lại) hoặc số dương (kích thước kí tự mở rộng ra). Ví dụ: letter-spacing: 2px.

- word-spacing: Thuộc tính này xác định khoảng cách giữa các từ trong một đoạn văn bản. Giá trị của thuộc tính này cũng có thể là số âm hoặc số dương. Ví dụ: word-spacing: 5px.

- text-shadow: Thuộc tính này cho phép bạn thêm hiệu ứng bóng cho văn bản. Bạn có thể xác định màu sắc của bóng, độ mờ, và vị trí của bóng. Ví dụ: text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5).

Vận dụng 2

Với bài đọc thêm Lịch sử CSS (Bài 13), em hãy thiết lập hai tệp CSS khác nhau để định dạng cho trang web mô tả bài đọc thêm này. Hai kiểu định dạng được thiết lập cần khác nhau về phông chữ, cỡ chữ và màu chữ.

Lời giải:

Kiểu 1:

Định dạng văn bản bằng CSS