CSS 06 – Điều khiển phần tử theo trạng thái

0
143

1. Điều khiển cho liên kết

Mỗi liên kết được tạo ra trong văn bản HTML đều tồn tại 4 sự kiện để bắt các trạng thái là: hover, link, active, visited. Và việc bắt được các trạng thái giúp chúng ta có thể điều khiển chúng bằng CSS.

a. Sự kiện link

Sự kiện link bắt trạng thái liên kết khi người dùng chưa click chuột vào liên kết.
Để điều khiển cho sự kiện này chúng ta sử dụng cú pháp như sau :

Ví dụ:

See the Pen vp_css_link_event_examp by Thien (@anhtomks) on CodePen.0

b. Sự kiện hover

Sự kiện hover bắt trạng thái liên kết khi người dùng hơ chuột qua liên kết
Để điều khiển cho sự kiện này chúng ta sử dụng cú pháp như sau :

Ví dụ:

See the Pen vp_css_hover_examp by Thien (@anhtomks) on CodePen.0

c. Sự kiện active

Sự kiện active bắt trạng thái liên kết khi người dùng đang giữ click chuột .
Để điều khiển cho sự kiện này chúng ta sử dụng cú pháp như sau :

Ví dụ:

See the Pen vp_css_active_event_examp by Thien (@anhtomks) on CodePen.0

d. Sự kiện visited

Sự kiện visited bắt trạng thái liên kết sau khi người dùng click chuột vào liên kết và đã thả chuột ra.
Để điều khiển cho sự kiện này chúng ta sử dụng cú pháp như sau :

Ví dụ:

See the Pen vp_css_visited_event_examp by Thien (@anhtomks) on CodePen.0

2. Điều khiển cho thẻ HTML

Với các thẻ HTML chúng ta có sự kiện hover bắt trạng thái khi thẻ HTML được hơ chuột qua.
Cú pháp:

Ví dụ:

See the Pen vp_css_tag_event_examp by Thien (@anhtomks) on CodePen.0

 

Tác giả: Thiện Nguyễn

[Total: 0    Average: 0/5]

LEAVE A REPLY

Please enter your comment!
Please enter your name here