Характеристики свойства
В каких браузерах работает?
9.0+ | 1.0+ | 9.0+ | 2.0+ | 1.7+ | 2.0+ | 1.0+ |
В каких версиях CSS используется?
CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
- | - | - | + |
Для чего используется?
Контролирует прозрачность элемента или картинки. Причем чем ниже значение свойства, тем лучше проступает силует объекта на заднем плане.
Как правильно задавать?
opacity:значение прозрачности;
Какие могут быть значения?
Значение свойства заключены в интервале от 0 до 1. При чем это будет десятичная дробь, чем выше ее значение, тем меньше прозрачность элемента. Возможна запись без нуля, но обязательна точка вначале (к примеру, .5).
Пример использования
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>opacity</title> <style> .img1 { position:absolute; top:10px; left:30px; } .img2 { position:absolute; top:40px; left:5px; } .block .img1 { position:absolute; top:10px; left:250px; opacity:0.3; } .block .img2 { position:absolute; top:40px; left:225px; } </style> </head> <body> <span> <img class="img2" width="200px" src="android.png"> <img class="img1" width="150px" src="apple.png"> </span> <span class="block"> <img class="img2" width="200px" src="android.png"> <img class="img1" width="150px" src="apple.png"> </span> </body> </html>
По итогу получаем
Тип CSS свойства:
Изображения