Share Tạo hiệu ứng hình ảnh với thư viện Imagehover.css

[filiallion]

Language

Tiếng Việt

Ngày nay khi thiết kế website, các nhà thiết kế web thường quan tâm đến những hiệu ứng độc đáo, ấn tượng để có thể thu hút được người dùng truy cập và nhấp vào website của các bạn. Với CSS và CSS3 hiện nay, có rất nhiều cách khác nhau để cung cấp hiệu ứng chuyển động, đặc biệt là cho hình ảnh.

Một trong số những cách tạo ra các hiệu ứng đẹp mắt cho hình ảnh phải nhắc đến đó là thư viện Imagehover.css. Bộ thư viện Imagehover.css cung cấp 44 hiệu ứng bằng CSS miễn phí với dung lượng nhỏ gọn (Chỉ khoảng 19KB) với nhiều hiệu ứng các bạn thường sử dụng trên website. Ngoài ra, các bạn có thể mua bản quyền để sử dụng đầy đủ 216 hiệu ứng khác nhau cho hình ảnh.

Việc sử dụng thư viện Imagehover.css thật sự rất đơn giản, các bạn truy cập địa chỉ http://www.imagehover.io và tải về gói thư viện miễn phí với 44 hiệu ứng hình ảnh.

Các bạn tích hợp thư viện Imagehover.css vào website với dòng lệnh như sau:

<link href="path/to/imagehover.css" rel="stylesheet">

Và sử dụng các hiệu ứng hình ảnh với nội dung mã lệnh như mẫu sau:

<figure class="imghvr-fade">
    <img src="path/to/image.jpg">
    <figcaption>Nội dung hover</figcaption>
</figure>

Các bạn có thể tìm hiểu thêm về thư viện Imagehover.css tại địa chỉ http://www.imagehover.io/docs.