phpcms实现点击导航栏目时添加自定义样式_网站建设

　　在进行网站建设时用户的体验是非常重要的。其中一项是当我们点击导航栏某个栏目时，指示当前栏目所在的位置，即给当前栏目添加自定义CSS样式，从而让访客知道自己所在的网站的层级。即给导航栏当前点击的栏目添加一定的栏目，例如改变颜色，改变背景，或添加边框等效果。以下是青锋建站－专业的网站建设公司给大家分享phpcms如何实现点击导航栏目时添加自定义样式。

1、实现phpcms添加自定义样式的思路

　　这里实现不是很复杂，只要是在输出导航时判断当前所在栏目的ID是否与当前输出的栏目ID相同，如果相同即是刚才点击的栏目，这时输出一个active类栏目，然后在CSS样式表中实现。

2、具体实现点击导航栏目时添加自定义样式的导航栏代码

　　{pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}
            <li class="nav-item"><a class="nav-link {if $catid ==0 } active{/if}" href="{siteurl($siteid)}">网址导航</a></li>
              {loop $data $r}
                  <li class="nav-item"><a class="nav-link {if $r[catid] == $catid } active{/if}" href="{$r[url]}">{$r[catname]}</a></li>
              {/loop}
        {/pc}

3、两级栏目时导航为顶级栏目的情况

　　当我们使用的导航为顶级栏目时，而我们的栏目层级为两级时，代码就要有所改变，当我们处于二级栏目或文章内页时都要给顶级栏目添加自定义样式时，我们使用以下代码来实现：
　　{pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}
            <li class="nav-item"><a class="nav-link {if $catid ==0 } active{/if}" href="{siteurl($siteid)}">网址导航</a></li>
              {loop $data $r}
                  <li class="nav-item"><a class="nav-link {if $r[catid] ==$catid||$r[catid] ==$parentid||$r[catid]==$CAT[parentid]} active{/if}" href="{$r[url]}">{$r[catname]}</a></li>
              {/loop}
        {/pc}
　　以上就是青锋建站给大家分享的phpcms如何实现点击导航栏目时添加自定义样式的方法，更多phpcms相关内容请访问网站建设教程一栏目。青锋建站，提供专业的高品质网站制作服务，包括网站建设，SEO，网络营销，PHP开发，网站建设知名品牌，全国接单，为企业构建强有力的营销平台。

转载请注明来源网址：青锋建站-http://www.sjzphp.com/webdis/phpcms_nav_512.html