2010-10-15 31 views
6

Tôi thấy trang web này có nút, khi tôi di chuột qua nó, nền thay đổi.kiểu css nào xử lý sự kiện nhấp trên nút? khác với hover

Khi tôi nhấp vào nút, nút đổ bóng chuyển đổi tức là phản ứng với sự kiện nhấp chuột.

Kiểu CSS nào? Tôi biết: di chuột là để di chuột, nhưng về nhấp chuột thì sao?

+0

Tôi muốn b e sẵn sàng đặt cược nó là javascript làm thao tác hình ảnh. – Gabe

Trả lời

4

CSS không xử lý sự kiện.

Bạn đang tìm kiếm lớp học giả :active, chỉ dành cho thẻ A, chứ không phải cho các nút. Bạn cũng có thể tạo kiểu cho các thẻ giống như các nút.

Xem: http://w3schools.com/CSS/css_pseudo_classes.asp

+2

không tham khảo w3schools .... http: //www.w3fools.com/ –

+2

Dude, bạn trễ ba năm trên mẹo đó. –

+0

... hoặc rõ ràng là có mùi. –

2

Những gì bạn đang nhìn vào là kiểu mặc định của trình duyệt cho: hoạt động pseudo-class, mà cũng áp dụng cho đầu vào bàn phím vào một nút (thử tabbing vào nó và nhấn phím cách).

Các lớp giả này KHÔNG chỉ áp dụng cho phần tử neo, đó là quan niệm sai lầm phổ biến gây ra bởi các phiên bản cũ của IE không hỗ trợ chúng trên bất kỳ thứ gì khác ngoài phần tử neo.

+0

phím cách hoạt động nhưng không chỉ đơn giản là nhấp vào chúng ... –

10

CSS3 hiện xử lý các sự kiện kích hoạt ngay bây giờ (2013).

Lớp giả hoạt động đang hoạt động trên bất kỳ bộ chọn css nào như BUTTON, không chỉ là thẻ A.

CSS3 STYLE

p { margin: 2em; } 
button { background-color: White; color: SteelBlue; } 
button:hover { background-color: LightSteelBlue; } 
button:active { background-color: SteelBlue; color: White; } 

HTML5

<p> 
     <button>test button with :active pseudo-class</button> 
    </p> 

Demo: http://jsfiddle.net/wp86u/

Xem: http://www.w3schools.com/css/css_pseudo_classes.asp (nội dung thay đổi kể từ Diodeus câu trả lời)

Các vấn đề liên quan