Trang chủ Lớp 12 SGK Tin học 12- Chân trời sáng tạo Bài F10. Định kiểu CSS cho siêu liên kết và danh sách...

Bài F10. Định kiểu CSS cho siêu liên kết và danh sách trang 123, 124, 125 Tin học 12 Chân trời sáng tạo: Điều gì sẽ xảy ra khi nháy chọn siêu liên kết bất kì của trang web...

Mở trang web bất kì và ấn chọn siêu liên kết để xem kết quả. Vận dụng kiến thức giải Câu hỏi trang 123, Câu hỏi trang 125, Câu hỏi trang 126; Câu hỏi trang 127: LT1, LT2; Câu hỏi trang 128: VD1, VD2 - Bài F10. Định kiểu CSS cho siêu liên kết và danh sách trang 123, 124, 125 SGK Tin học 12 Chân trời sáng tạo - Chủ đề F. Giải quyết vấn đề với sự trợ giúp của máy tính. Điều gì sẽ xảy ra khi nháy chọn siêu liên kết bất kì của trang web...

Câu hỏi trang 123

Điều gì sẽ xảy ra khi nháy chọn siêu liên kết bất kì của trang web.

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Mở trang web bất kì và ấn chọn siêu liên kết để xem kết quả.

Answer - Lời giải/Đáp án

Khi nháy chọn siêu liên kết bất kì của trang web thì sẽ dẫn đến một trang web khác.


Câu hỏi trang 125

Viết mã lệnh CSS để khi người dùng di chuyển con trỏ chuột đến siêu liên kết sẽ phóng to cỡ chữ và có màu nền bao quanh (màu sắc tuỳ ý).

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Sử dụng định dạng font-size và background-color để thực hiện yêu cầu.

Answer - Lời giải/Đáp án

Mã lệnh CSS:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19854.png


Câu hỏi trang 126

Em hãy thay đổi lần lượt các giá trị của thuộc tính list-style-position, đồng thời thay đổi độ rộng của trang web để xem kết quả hiển thị.

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Kết hợp các thuộc tính kích thước để thay đổi theo yêu cầu.

Answer - Lời giải/Đáp án

Để thay đổi giá trị của thuộc tính list-style-position và độ rộng của trang web để xem kết quả hiển thị, em có thể sử dụng mã CSS sau:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19855.png


Câu hỏi trang 127 Luyện tập (LT) 1

Thảo luận với bạn và cho biết các trạng thái của siêu liên kết khi có sự tương tác của người dùng. Trình bày cách định kiểu CSS ứng với mỗi trạng thái đó.

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Cùng bạn thảo luận và tìm hiểu thông tin về siêu liên kết các sự tương tác người dùng.

Answer - Lời giải/Đáp án

Các trạng thái:

- Trạng thái bình thường.

- Trạng thái lướt qua.

- Trạng thái kích hoạt.

- Trạng thái đã truy cập.


Câu hỏi trang 127 Luyện tập (LT) 2

Em hãy cho biết cách định kiểu cho các mục trong danh sách trong CSS.

Advertisements (Quảng cáo)

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Dựa vào kiến thức được học trong bài để trả lời câu hỏi.

Answer - Lời giải/Đáp án

Để định kiểu cho số hoặc dấu đầu các mục trong danh sách, ta sử dụng thuộc tính list- style-type và chỉ định những kiểu do CSS quy định sẵn.


Câu hỏi trang 128 Vận dụng (VD) 1

Trong tệp portfolio.html, định kiểu riêng cho các mục trong danh sách Các hoạt động đã tham gia như sau:

a) Đánh số đầu dòng cho mỗi mục.

b) Mỗi mục được đóng khung và màu sắc tuỳ ý.

Method - Phương pháp giải/Hướng dẫn/Gợi ý

a) Sử dụng thuộc tính list-style-type và đặt giá trị là "decimal” trong CSS.

b) Sử dụng thuộc tính border và background-color trong CSS.

Answer - Lời giải/Đáp án

a)

Để đánh số đầu dòng cho mỗi mục trong danh sách, em có thể sử dụng thuộc tính list-style-type và đặt giá trị là "decimal” trong CSS. Dưới đây là một ví dụ:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19857.png

b)

Để đóng khung và định kiểu màu sắc cho mỗi mục trong danh sách, em có thể sử dụng thuộc tính border và background-color trong CSS. Dưới đây là một ví dụ:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19858.png


Câu hỏi trang 128 Vận dụng (VD) 2

Tạo một tệp HTML mới, trong đó bao gồm một thanh trình đơn mới theo các yêu cầu sau:

a) Thanh trình đơn gồm các mục sau: Trang chủ, Học tập, Phong trào và Liên lạc.

b) Mỗi mục là một siêu liên kết đến một tệp HTML tương ứng.

c) Thanh trình đơn nằm bên trái trang web, theo phương dọc.

d) Định kiểu màu sắc tuỳ ý khi người dùng tương tác với thanh trình đơn.

Method - Phương pháp giải/Hướng dẫn/Gợi ý

Có thể sử dụng các phần tử như bảng hoặc khung.

Answer - Lời giải/Đáp án

Dưới đây là một ví dụ về cách tạo một thanh trình đơn trong một tệp HTML mới, đáp ứng các yêu cầu đã nêu:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19863.png

https://tech12h.com/sites/default/files/ck5/2024-04/image_19862.png

Hiển thị:

https://tech12h.com/sites/default/files/ck5/2024-04/image_19861.png