我遇到了CSS的问题。通常我可以做对,但现在它不适合我。
获得菜单代码
<nav>
<ul class="ca-menua">
<li class="home"><a href="#home" id="1" class="tooltip"><div class="ca-icona">O</div><span>Home</span></a>
</li>
<li class="info"><a href="#info" id="2" class="tooltip"><div class="ca-icona">e</div><span>Info</span></a>
</li>
<li class="komp"><a href="#komp" id="3" class="tooltip"><div class="ca-icona">S</div><span>Kompetencer</span></a>
</li>
<li class="cases"><a href="#cases" id="4" class="tooltip"><div class="ca-icona">F</div><span>Cases</span></a>
</li>
<li class="kontakt"><a href="#kont" id="5" class="tooltip"><div class="ca-icona">@</div><span>Kontakt</span></a>
</li>
</ul>
</nav>
我已经获得了添加活动类的javascript。
<script type="text/javascript">
$(document).ready(function(){
$('.home a.tooltip').addClass('active');
});
</script>
<script type="text/javascript">
$(function() {
$('a.tooltip').click(function(e) {
var $this = $(this);
$("#nav").load($this.attr('href'));
$('a.tooltip').removeClass('active');
$(this).addClass('active');
// prevent default link click
e.preventDefault();
})
});
</script>
这很好用,并添加了类,但我无法正确使用CSS!
我需要一些关于概率的帮助。小问题。 网站链接为:HERE
CSS:
a.tooltop.active{
color: #f3cb12;
font-size: 50px;
}
答案 0 :(得分:1)
只需将div
部分添加到a.tooltip.active
选择器中即可获得以下内容:
a.tooltip.active div {
color: #F3CB12;
font-size: 50px;
}
我假设您尝试将图标放大并突出显示菜单项是否处于活动状态。问题是它不是应该获得新样式的锚,而是子div元素。