HTML CSS – Tạo hiệu ứng hover với Css3 (P1)

0
379

1. Giới thiệu

  • Đôi khi chúng ta sẽ cần sử dụng những mẫu menu đơn giản với hiệu ứng hover đẹp mắt mà không cần phải sử dụng những hình ảnh hay đoạn script cho nặng nề. Trong bài viết này, tôi sẽ hướng dẫn cho các bạn sử dụng hiệu ứng hover vào trong menu để cho đẹp mắt hơn bằng bài học css chúng ta đã học.
Bấm Subscribe Nhận video học mới nhất :

2. Demo

  • Ở đây tôi có một menu reponsive với đoạn mã HTML có class=”menux1″ cho các danh mục như :

  • Tiếp theo tôi sẽ có Mã CSS các class= “menux1” như :

  • Giờ chúng ta sẽ có một menu khi trỏ chuột với hiệu ứng hover các chấm tròn thế này :

1

  • Như này

1

3. Tổng kết

  • Như vậy tôi đã hướng dẫn các bạn cách hover trong css3 vào thanh menu và các bạn cũng có thể áp dụng với các hiệu ứng khác đẹp mắt hơn. Xin chào, chúc các bạn học thật tốt

Các bạn xem thêm các bài khác tại đây:

Tác giả : Hà Trần Vietpro

[Total: 0    Average: 0/5]

LEAVE A REPLY

Please enter your comment!
Please enter your name here