<!DOCTYPE html>
<html>
<head>
<style>
img:hover {
opacity: 0.5;
}
</style>
</head>
<body>
<h1>画像の透明度</h1>
<p>opacityプロパティは、マウスオーバー時の不透明度を変更するために、しばしば:hoverセレクタと一緒に使用されます。</p>
<img src="https://img-techis-jp.sgp1.digitaloceanspaces.com/css/img_forest.jpg" alt="Forest" width="170" height="100">
<img src="https://img-techis-jp.sgp1.digitaloceanspaces.com/css/img_mountains.jpg" alt="Mountains" width="170" height="100">
<img src="https://img-techis-jp.sgp1.digitaloceanspaces.com/css/img_5terre.jpg" alt="Italy" width="170" height="100">
</body>
</html>
