Marro：
私は、HTMLやCSSに新たなんだと私はテキストホバー上でこの（株）映像ショーを持ってしようとしています。
私は、理想的には、IDの要素を持つ、画像はdiv要素の子であるが、私はdiv要素の間の仕事にそれを取得したい場合は、この作品の例をたくさん見てきました。私は私がやろうとしていることは無効である場合、私はわからないんだけど、私のCSSセレクタが正しいと信じています。すべてのヘルプは、私はまた、JavaScriptのソリューションを開いている、認識されます。
編集：私はホバー効果のみタグ内の「重要なテキスト」に機能するソリューションを探しています。
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="textcontainer">
<p> <a id="text1">Important text</a> other text etc </p>
</div>
<div class="gallerycontainer">
<img id="fig1" src="https://image.shutterstock.com/image-photo/black-male-hand-measuring-invisible-260nw-1070365622.jpg"/>
</div>
</body>
<style>
#fig1 {
opacity: 0.0;
-webkit-transition: all 500ms ease-in-out;
-moz-transition: all 500ms ease-in-out;
-ms-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
}
#text1:hover + #fig1 {
/* visibility: hidden;
display: none; */
opacity: 1.0;
}
</style>
</html>
Banzay：
ここでのソリューションです。あなたは、連鎖右のセレクターを追跡する必要があります
#fig1 {
transition: all 500ms ease-in-out;
}
.textcontainer + .gallerycontainer #fig1 {
opacity: 0;
}
.textcontainer:hover + .gallerycontainer #fig1 {
opacity: 1;
}<div class="textcontainer">
<p> <a id="text1">Important text</a> other text etc </p>
</div>
<div class="gallerycontainer">
<img id="fig1" src="https://image.shutterstock.com/image-photo/black-male-hand-measuring-invisible-260nw-1070365622.jpg"/>
</div>