Css 如何在导航菜单栏项目'；它被按下并翻转到它应该在的页面

因此，我希望发生的是，一旦按下菜单项，站点将翻转到该页面，但在该页面上，指向该页面的按钮仍处于活动状态，以显示用户在站点上的位置。到目前为止，我还没有找到一个有效的组合，我希望它能与css3一起工作

html

<div id="navMenu">
                <ul id="MenuBar1" class="MenuBarHorizontal">
                    <li><a href="index.html">&nbsp;HOME&nbsp;</a></li>
                    <li><a href="surveying.html">SURVEYING</a></li>
                    <li><a href="engineering.html">ENGINEERING</a></li>
                    <li><a href="companyProfile.html">COMPANY PROFILE</a></li>
                    <li><a href="products.html">PRODUCTS</a></li>
                    <li><a href="clients.html">CLIENTS</a></li>
                    <li><a href="contacUs.html">CONTACT US&nbsp;</a></li>
                </ul>
        </div>

---

在目标页面中，在指示用户所在页面的项目上放置一个类似“current”的类名

            <ul id="MenuBar1" class="MenuBarHorizontal">
                <li><a href="index.html">&nbsp;HOME&nbsp;</a></li>
                <li><a href="surveying.html">SURVEYING</a></li>
                <li class="current"><a href="engineering.html">ENGINEERING</a></li>
                <li><a href="companyProfile.html">COMPANY PROFILE</a></li>
                <li><a href="products.html">PRODUCTS</a></li>
                <li><a href="clients.html">CLIENTS</a></li>
                <li><a href="contacUs.html">CONTACT US&nbsp;</a></li>
           </ul>

            <ul id="MenuBar1" class="MenuBarHorizontal">
                <li><a href="index.html">&nbsp;HOME&nbsp;</a></li>
                <li><a href="surveying.html">SURVEYING</a></li>
                <li class="current"><a href="engineering.html">ENGINEERING</a></li>
                <li><a href="companyProfile.html">COMPANY PROFILE</a></li>
                <li><a href="products.html">PRODUCTS</a></li>
                <li><a href="clients.html">CLIENTS</a></li>
                <li><a href="contacUs.html">CONTACT US&nbsp;</a></li>
           </ul>

   .current{font-weight:bold /* etc. */ }