Chúng ta đã biết nhiều cách thiết lập mẫu định dạng cho các phần tử HTML. Tuy nhiên, các lệnh định dạng CSS đã biết đều chỉ áp dụng cho các phần tử tĩnh, tức là không phụ thuộc vào tương tác với người dùng. Vậy có cách nào thiết lập CSS để định dạng cho các trạng thái tương tác với người dùng, ví dụ như trạng thái khi người dùng di chuyển hay nháy chuột lên phần tử đó không?
Xem đáp án và lời giải
Hướng dẫn chấm do TopStudy biên soạn, mang tính gợi ý
Có, em có thể sử dụng các lớp (class) và các trạng thái tương tác như :hover, :active, và :focus để định dạng các phần tử HTML trong các trạng thái tương tác với người dùng.
Câu 2
1 điểm
Thảo luận và trả lời các câu hỏi sau:
1. Thế nào là pseudo-class của bộ chọn? Cách áp dụng.
2. Thế nào là pseudo-element của bộ chọn? Nêu ý nghĩa của khái niệm này trong định dạng CSS
Xem đáp án và lời giải
Hướng dẫn chấm do TopStudy biên soạn, mang tính gợi ý
1. Pseudo-class là một khái niệm trong CSS cho phép chọn các trạng thái đặc biệt của phần tử HTML. Chúng được áp dụng bằng cách sử dụng cú pháp "selector:pseudo-class", trong đó "pseudo-class" là tên của trạng thái cần chọn. Ví dụ: a:link, a:visited, :hover là các pseudo-class phổ biến.
2. Pseudo-element là một khái niệm trong CSS cho phép chọn một phần hoặc một thành phần của phần tử HTML. Nó cho phép thiết lập định dạng cho các phần tử giả mà không cần thay đổi cấu trúc HTML. Pseudo-element được quy định bằng cú pháp "::pseudo-element", trong đó "pseudo-element" là tên của phần tử giả cần chọn. Ví dụ: ::first-line, ::first-letter, ::selection là các pseudo-element phổ biến.
Câu 3
1 điểm
Muốn áp dụng đổi màu chữ một vùng trên màn hình khi nháy chuột tại vùng đó thì cần phải dùng định dạng CSS nào?
Xem đáp án và lời giải
Hướng dẫn chấm do TopStudy biên soạn, mang tính gợi ý
Để áp dụng đổi màu chữ cho một vùng trên màn hình khi nháy chuột tại vùng đó, em có thể sử dụng pseudo-class ":hover".
Câu 4
1 điểm
Muốn tăng kích thước một đoạn văn bản khi di chuyển chuột qua đoạn văn bản đó thì cần dùng định dạng CSS nào?
Xem đáp án và lời giải
Hướng dẫn chấm do TopStudy biên soạn, mang tính gợi ý
Để tăng kích thước một đoạn văn bản khi di chuột qua đó, em có thể sử dụng pseudo-class ":hover".
Câu 5
1 điểm
Giả sử có định dạng CSS như sau:
CSS trên áp dụng cho phần tử HTML sau:
Khi đó cụm từ “Tin học 12” sẽ có màu gì?
Xem đáp án và lời giải
Hướng dẫn chấm do TopStudy biên soạn, mang tính gợi ý
Trong phần Thực hành, các tên riêng (tên người, tên tổ chức) cần được bổ sung định dạng đóng khung và in nghiêng. Em sẽ thực hiện các yêu cầu này như thế nào?
