通过 CSS 修改父元素来影响子元素.是否可以?

2022-01-22 00:00:00 hover css

也许这是一个愚蠢的问题，但我相信它对许多初学者很有用.我已经构建了一个代码.我要做的是显示当前隐藏的文本(在 <p> 标签中)，只有当实际的 <a> 悬停时.没有js可以吗?可以只对css/html进行操作吗?html代码在这里:

Maybe it's a silly question, but I'm sure it will be useful for many of beginners. I have constructed a code. What I'm trying to do is to display the text (in <p> tags) which is currently hidden, only when the actual <a> is hovered. Is this possible without js? Can it be done by operating on css / html only? the html code is here:

                <div class="promo2">
                    <a href="speakers-hire.html">
                        <div class="promo2a">
                            <p>SPEAKERS</p>
                        </div>
                    </a>

                    <a href="decks-hire.html">
                         <div class="promo2a">
                            <p>CD PLAYERS</p>
                        </div>
                    </a>

                </div>

以及上面html对应的css:

and the css which correspond to the above html:

.promo2a:hover{
background:url(../_images/generic/glass5.png);
display:inline-block;

}

.promo2a p{
display:none;

}

所以基本上我希望在整个 div promo2a 悬停时显示 <p> 中的文本.

So basically I want the text in <p> to be displayed when the whole div promo2a is hovered.

非常感谢任何帮助.提前谢谢你.

Any help is kindly appreciated. Thank you in advance.

推荐答案

试试

.promo2a:hover > p {display:block;}

或任何适合您的需求

相关文章