如何删除带有子菜单项的导航元素周围的蓝色阴影？

Question

如果有任何帮助，我将不胜感激。

我已经检查了样式，但找不到导致此问题的原因；我需要删除将鼠标悬停在顶部导航菜单元素上时出现的蓝色阴影元素。这只发生在有子菜单项的项目上，并且只发生在 Chrome 和 Safari 中。

这里是link问题导航http://www.freedomflooring.co.nz/testing-changes.html

该站点正在使用 Zurb Foundation 框架。

<nav class="marketing-topbar">

<div class="desktopMenuWrap ">
    <ul class="dropdown menu" data-dropdown-menu data-click-open="false">

        <li><a href="#">About</a>
          <ul class="submenu menu vertical" data-submenu>

              <li><a href="#">Approach</a></li>
              <li><a href="#">Finance</a></li>

            </ul>
        </li>    
    </ul>      
</div> 


</nav>

Answer 1

您可能正在寻找 outline: 0px;，它将在元素获得焦点时删除 "border"。我用 Chrome 对其进行了测试，它对我来说效果很好。

有关大纲的详细信息，请参阅https://developer.mozilla.org/en/docs/Web/CSS/outline。

如何删除带有子菜单项的导航元素周围的蓝色阴影？

How do I remove the blue shading around Navigation elements with sub-menu items?

css

zurb-foundation

drop-down-menu