Share Tạo hiệu ứng shadow dễ dàng với thư viện Box-shadows.css

[filiallion]

Language

Tiếng Việt

Hiệu ứng CSS shadow thường được sử dụng để thiết kế làm nổi các thành phần trên website. Việc thiết kế hiệu ứng shadow thật sự rất đơn giản chỉ với vài dòng lệnh CSS3. Tuy nhiên, nếu các bạn muốn công việc của mình trở nên đơn giản và nhanh chóng hơn nữa thì việc sử dụng một thư viện khác là lựa chọn được ưu tiên. Thư viện tạo hiệu ứng shadow các bạn nên tìm hiểu và sử dụng đó là Box-shadows.css, với nhiều kiểu shadow đẹp mắt và cho phép các bạn tuỳ chỉnh dễ dàng chỉ với vài khai báo CSS3 đơn giản.

Thư viện Box-shadows.css hỗ trợ rất nhiều kiểu shadow khác nhau, dung lượng thư viện lại rất nhỏ, không ảnh hướng tới tốc độ website. Việc sử dụng thư viện Box-shadows.css cũng rất đơn giản, các bạn chỉ việc tải về tại địa chỉ https://github.com/madeas/box-shadows.css và tích hợp vào website với dòng mã lệnh HTML như sau:

<link href="path/to/box-shadows.min.css" rel="stylesheet">

Bây giờ, các bạn có thể áp dụng các hiệu ứng shadow của thư viện Box-shadows.css như ví dụ sau:

<div class="bShadow bShadow-1">Welcome to Gextend</div>

Các bạn có thể tìm hiểu thêm về thư viện Box-shadows.css tại địa chỉ https://github.com/madeas/box-shadows.css.