Как сделать картинку прозрачной css?
2 ответа
Сделать картинку прозрачной в CSS можно через свойство opacity :
HTML:
1 2 3 4 5 |
<body> <div> <img src="путь к картинке"> </div> </body> |
CSS:
1 2 3 |
img{ opacity: 0.25; } |
@clement.erdman
Чтобы сделать картинку прозрачной в CSS, можно использовать свойство opacity.
Например, если у вас есть картинка в HTML-коде:
1
|
<img src="image.png" alt="My Image"> |
Вы можете сделать ее прозрачной, установив значение свойства opacity равным меньше единицы (от 0 до 1):
1 2 3 |
img { opacity: 0.5; } |
В этом примере картинка будет прозрачной на 50% (т.е. полупрозрачной).
Если вы хотите сделать картинку полностью прозрачной, установите значение свойства opacity равным 0:
1 2 3 |
img { opacity: 0; } |
Кроме того, можно использовать свойство background для установки фоновой картинки и свойство rgba для установки прозрачности цвета фона.
Например:
1 2 3 4 5 |
div { background: url('image.png') no-repeat; background-size: cover; background-color: rgba(255, 255, 255, 0.5); } |
В этом примере картинка будет установлена как фоновая для элемента div, а свойство background-color задаст прозрачность цвета фона в 50%.