所以我想设置一个包含其他html元素的锚元素。基本代码是:
HTML:
<div class="container" id="sub-menu">
<div class="row" data-bind="foreach: subMenu">
<a href="#">
<div class="col-md-3 col-sm-6">
<h3><span>title</span></h3>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim</div>
</div>
</a>
</div>
</div>
引导类不会打扰你:) 这是CSS(从较少生成):
#sub-menu {
margin-top: 10px;
}
#sub-menu a span {
color: black;
}
#sub-menu a div {
color: #6b6b6b;
}
#sub-menu a:hover {
color: red !important;
text-decoration: none;
}
目标是当用户将鼠标悬停在锚点上时,文本颜色应为红色。使用此解决方案,未应用红色但文本装饰效果很好。这是一个fiddle edition
如果我在一个级别上设置颜色比它的效果好(fiddle)或者根本不设置颜色(fiddle),但是我需要为标题和正文部分设置不同的颜色。
我也尝试为每个元素(fiddle demo)设置悬停伪,但是丑陋的是装饰全部起作用,但只有当我将鼠标悬停在精确元素上时才会应用颜色。
我想要实现第二个版本,但使用自定义颜色,如第一个版本
谢谢你的帮助。
答案 0 :(得分:1)
如果你试图为锚元素中包含的所有元素着色,这应该可以工作
#sub-menu a:hover *{
color: red;
}