Có cách nào để thêm: di chuột vào CSS: lớp giả đầu tiên không?

Question

Tôi đã sửa đổi một số css để đánh dấu HTML. Vấn đề tôi phải đối mặt là có một phong cách đã được áp dụng bằng cách sử dụng CSS :first-line giả lớp. Những gì tôi muốn là thay đổi phong cách của dòng đầu tiên này trên trạng thái di chuột. Có cách nào để áp dụng một cái gì đó như p:first-line:hover?

Answer 1

Bạn cần phải xác định p:first-line trước khi bạn có thể xác định chuỗi p:first-line:hover như vậy:
p:first-line { color: black; }
p:hover:first-line { color: red; }

Fiddle

Answer 2

Đúng, bạn có thể chuỗi chúng (có giao diện here).

p:hover:first-line 

Answer 3

chủ đề Rất hấp dẫn! Tôi đã thử một phiên bản jQuery và phát hiện ra, rằng ngay cả điều đó sẽ không hoạt động. Trong Firefox, lớp này phải được áp dụng trước tiên để hoạt động khi di chuột, như bạn có thể thấy trong số Fiddle này. Nhưng WebKit hoàn toàn bỏ qua số :first-line khi thêm lớp động.

<p class="hovered">Text .... </p> 

Đối với Firefox, lớp học phải được đặt trong mã HTML. Bây giờ, sau đây là công việc.

jQuery('p').removeClass('hovered'); 

jQuery('p').hover(function() { 
    jQuery(this).addClass('hovered'); 
}, function() { 
    jQuery(this).removeClass('hovered'); 
}); 

Nhưng sẽ không hoạt động trong WebKit.