如何在标题菜单中显示选定页面的下划线

Question

I want to show under line of Selected Page in header Menu. And The Header is Comman File For All. is Header.php

<div id="navbar" class="collapse navbar-collapse">
 <ul class="nav navbar-nav" id="nav">
   <li class="<?php (basename($_SERVER['PHP_SELF'], "index.php") !== false) ? 'active' : '' ?>"><a href="index.php">Home</a></li>
<li class="<?php (strpos($_SERVER['REQUEST_URI'], "jobsList") !== false) ? 'active' : '' ?>"><a href="jobsList.php?id=3">Bank Job</a></li>
<li class="<?php (strpos($_SERVER['REQUEST_URI'], "boardResult") !== false) ? 'active' : '' ?>"><a href="boardResult.php">Board Result</a></li>
<li class="<?php (strpos($_SERVER['REQUEST_URI'], "AdmitCard") !== false) ? 'active' : '' ?>"><a href="AdmitCard.php">Admit Card</a></li>
<li class="<?php (strpos($_SERVER['REQUEST_URI'], "AnsKey") !== false) ? 'active' : '' ?>"><a href="AnsKey.php">Answer Key </a></li>
<li class="<?php (strpos($_SERVER['REQUEST_URI'], "TimeTable") !== false) ? 'active' : '' ?>"><a href="TimeTable.php">Time Table </a></li>

</ul>
</div>

Answer 1

I see you can use PHP.

You can check the current URI on the URL and if it matches then add the class 'active' on the desired li to add the underline style :)

This would do the job:

HTML

<div id="navbar" class="collapse navbar-collapse">
 <ul class="nav navbar-nav" id="nav">
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "index") !== false) ? 'active' : '' ?>"><a href="index.php">Home</a></li>
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "jobsList") !== false) ? 'active' : '' ?>"><a href="jobsList.php?id=3">Bank Job</a></li>
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "boardResult") !== false) ? 'active' : '' ?>"><a href="boardResult.php">Board Result</a></li>
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "AdmitCard") !== false) ? 'active' : '' ?>"><a href="AdmitCard.php">Admit Card</a></li>
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "AnsKey") !== false) ? 'active' : '' ?>"><a href="AnsKey.php">Answer Key </a></li>
    <li class="<?php echo (strpos($_SERVER['REQUEST_URI'], "TimeTable") !== false) ? 'active' : '' ?>"><a href="TimeTable.php">Time Table </a></li>
 </ul>
</div>

Or you can try

<li class="<?= (strpos($_SERVER['REQUEST_URI'], "index") !== false) ? 'active' : '' ?>"><a href="index.php">Home</a></li>

CSS

#nav li.active a {
  /* Apply the styles you want on the active anchors*/
  border-bottom: 1px solid red;
}