我正在寻找一种方法来使用CSS来改变与当前活动页面相关的nav元素的显示属性。
例如，如果用户在主页上，导航中的"Home"按钮的样式不同。
我使用以下代码:
<li class="active">
<a href="<?php echo $sito ?>/index.php">Home</a>
</li>
<li>
<a href="<?php echo $sito ?>/page1.html">page1</a>
</li>
<li>
<a href="<?php echo $sito ?>/page2.html">page2</a>
</li>
当我选择page1或page2时，home键保持活动状态!
使用
var $links = $('li');
$links.click(function(){
$links.removeClass('active');
$(this).addClass('active');
});
<li <?php if($page=='home'){?> class="active"<?php }?>>
<a href="<?php echo $sito ?>/index.php">Home</a>
</li>
<li <?php if($page=='page1'){?> class="active"<?php }?>>
<a href="<?php echo $sito ?>/page1.html">page1</a>
</li>
<li <?php if($page=='page2'){?> class="active"<?php }?>>
<a href="<?php echo $sito ?>/page2.html">page2</a>
</li>
据我所知-您有一个静态页面。如果是，只需在page1.html和page2.html中添加class="active"对应的<li>
在page1.html中是第二个<li>元素，但在page2.html中是最后一个