2

対応する画像の上にカーソルを置いたときに、テキスト リンクのプロパティ (異なる色と text-decoration:underline;) を変更しようとしています。

これはhtmlです：

<!-- Wraps image, title, category -->
                <div class="itemWrap">
                    <!-- Item Image -->
                    <a href="#" class="itemImageLink"><img class="itemImage" src="img/thumb.png" alt="thumb"></a>
                    <!-- Item Title -->
                    <div class="itemTitle">
                        <a href="#">The original soul of Michael Jackson</a>
                    </div>
                    <!-- Item Category -->
                    <div class="itemCat">
                        <a href="#">12" Picture Disc</a>
                    </div>
                </div><!-- close itemWrap -->

.itemTitle 内のリンクのプロパティを変更できる itemImage (アンカーで囲まれている) にカーソルを合わせると、可能性はありますか?

Web ページで itemWrap が複数回使用されていることに注意してください。

ありがとう

4

2 に答える 2

0

特定の問題を解決することができましたが、他の人々の試みに感謝します。

兄弟セレクターと子孫セレクターを組み合わせて使用​​する必要がありました。

:hover画像の周りのアンカーに擬似を適用し、名前で次の兄弟を選択し、.itemTitle次に .itemTitle の子孫を選択しました.itemTitleLink。

.itemImageLink:hover ~ .itemTitle > .itemTitleLink {color:#CD3333;text-decoration:underline;}

<a href="#" class="itemImageLink">
<div class="itemTitle"><!-- sibling of .itemImageLink -->
    <a href="#" class="itemTitleLink">Link</a><!-- descendant of .itemTitle -->
</div>
于 2013-04-06T01:39:51.627 に答える