<div id="description">
<h2>Приклад 2</h2>
<p>Перше зображенная - оригінальне, друге - з функцією opacity().</p>
</div>
<div id="result">
<img src="https://picsum.photos/200/200" alt="Зображення 1" class="image">
<img src="https://picsum.photos/200/200" alt="Зображення 2" class="image withopacity">
</div>
#description {
background-color: #f2f2f2;
padding: 20px;
font-family: Arial, sans-serif;
margin-bottom: 20px;
}
.square {
width: 200px;
height: 200px;
display: inline-block;
}
.image.withopacity {
filter: opacity(0.5);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.