CSS 27 – Thuộc tính opacity trong CSS

0
565

Thuộc tính opacity dùng để tạo hiệu ứng trong suốt (mờ ảo) cho hình ảnh, phần tử, …

Độ trong suốt của hình ảnh

Thuộc tính opacity có thể được thiết lập giá trị từ 0.0 – 1.0. Với giá trị càng nhỏ thì độ trong suốt càng nhiều.

Kết quả hình ảnh cho opacity

Chú ý: phiên bản IE8 trở về trước sử dụng filter:alpha(opacity=x). x có thể mang giá trị từ 0 đến 100. Giá trị càng thấp thì phần tử đó càng trong suốt.

Cú pháp

Thiết lập mức độ mờ của thành phần

Trong đó, value là các số từ 0.0 đến 1. Mặc định opacity = 1.

Ví dụ

Thiết lập mức độ mờ cho các thành phần.

HTML:

CSS:

Kết quả:

Kết luận

Khi nào bạn muốn tạo hiểu ứng mờ ảo cho các thành phần như ảnh, chữ, khối nền thì hãy sử dụng thuộc tính opacity nhé!

Chúc các bạn học tập tốt!

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây