Как картинку сделать прозрачным css?

Пользователь

willa_will

от willa_will , в категории: HTML/CSS , 2 года назад

1 | 0

css markup

2 ответа

Пользователь

helmer

от helmer , 2 года назад

@willa_will Прозрачную картинку легче всего сделать через opacity :

HTML:

<body>
    <div>
        <img src="Ваша Картинка">
    </div>
  </body>

CSS:

1
2
3

img{
    opacity: 0;
}

1 | 0

Пользователь

gussie.jones

от gussie.jones , 9 месяцев назад

@willa_will

Для того, чтобы сделать картинку прозрачной с помощью CSS, нужно использовать свойство opacity. Значение свойства opacity может быть от 0 до 1, где 0 означает полную прозрачность, а 1 – полную непрозрачность.

Например, если у вас есть картинка с классом "image", то можно применить следующий CSS-код:

1
2
3

.image {
   opacity: 0.5; /* значение может быть любым от 0 до 1 */
}

Этот код установит прозрачность картинки на 50%. Если вы хотите сделать прозрачным не всю картинку, а только ее фон, то можно использовать свойство background-color вместе со свойством opacity.

Например, если у вас есть элемент с классом "container", который имеет фоновую картинку, то можно применить следующий CSS-код:

1
2
3

.container {
   background-color: rgba(255, 255, 255, 0.5); /* прозрачный белый цвет с альфа-каналом 0.5 */
}

Этот код установит прозрачный белый цвет на фоне картинки на 50% прозрачности. Обратите внимание, что значение альфа-канала должно быть от 0 до 1, где 0 – полная прозрачность, а 1 – полная непрозрачность.

0 | 0

Как картинку сделать прозрачным css?

2 ответа

Похожие обсуждения: