如何删除导航栏中的蓝色轮廓？ [英] How to remove blue-ish outline in navigation bar?

问题描述

几个小时前，我问了一个关于当我添加可折叠列表时我的背景消失的问题。他们给我的解决方案是：

  body.ui-overlay-a {
 background-color：＃dc143c; 
} 
 div.ui-page-theme-a {
 background-color：transparent; 
} 
  

我向同一个人询问蓝色方块，他给了我这个：

  div.ui-page-theme-a {
 background-color：transparent; 
} 
  

但这不起作用有人有答案吗？

导航栏代码（CSS）：

  / *导航栏* / 
 .nav {
 font-family：'Roboto'，sans-serif; 
 margin-top：20px; 
 height：40px; 
背景：＃000000; 
} 
 
 .nav ul {
 margin：0; 
 padding：0; 
} 
 
 .nav ul li {
 list-style：none; 
} 
 
 .nav ul li a {
 text-decoration：none; 
 float：right; 
 display：block; 
 padding：10px 50px; 
颜色：白色; 
} 
 
 .nav ul li a：hover {
 color：＃D3D3D3; 
} 
 
 .headerBreak {
 width：100％; 
 height：0; 
 border-bottom：2px solid＃000000; 
} 
 
 h4 {
 font-family：'Roboto'，sans-serif; 
 font-size：24px; 
 text-align：right; 
 text-decoration：none; 
} 
 
 p {
 font-family：'Lato'，sans-serif; 
 font-size：30px; 
} 
  

这是导航栏内的内容

 < div class =nav> 
< ul> 
< li>< a href =＃>通讯录< / a>< / li> 
< li>< a href =＃>地图< / a>< / li> 
< li>< a href =＃>预订< / a>< / li> 
< li>< a href =＃>在线订单< / a>< / li> 
< li>< a href =＃>菜单< / a>< / li> 
< li>< a href =＃>关于< / a>< / li> 
< li>< a href =＃>主页< / a>< / li> 
< / ul> 
< / div> 
 
< div class =headerBreak>< / div> 
  

请注意，这不仅适用于导航栏，而且也适用于我和

参考： http：//i.imgur。 com / acnJE5Y.png
编辑1：我将此网站添加到免费的域名托管服务商，我还添加了大纲：无; 至 nav ul li a {但它仍然不工作，当我打开它，但当我复制文件，我打开它的文本没有蓝色轮廓，但在我的原始文件

http://marcxu88.000webhostapp.com

如果您可以检查代码并查看是否有什么问题，我们将非常感谢。

尝试在选择器中添加 outline：none; code> .nav ul li a 。

A few hours back I asked a question on how my background disappeared when i added a collapsible list. The solution they gave me was:

 body.ui-overlay-a {
            background-color: #dc143c;
        }
        div.ui-page-theme-a  {
            background-color: transparent;
        }

I asked the same person about the blue box and he gave me this:

div.ui-page-theme-a  {
            background-color: transparent;
        }

But this didn't work does anyone have any answers?

Navigation bar code (CSS):

/* Navigation bar */
        .nav {
            font-family: 'Roboto', sans-serif;
            margin-top: 20px;
            height: 40px;
            background: #000000;
        }

        .nav ul {
            margin: 0;
            padding: 0;
        }

        .nav ul li {
            list-style:  none;
        }

        .nav ul li a {
            text-decoration: none;
            float: right;
            display: block;
            padding: 10px 50px;
            color: white;
        }

        .nav ul li a:hover {
            color: #D3D3D3;
        }

        .headerBreak {
            width: 100%;
            height: 0;
            border-bottom: 2px solid #000000;
        }

        h4 {
            font-family: 'Roboto', sans-serif;
            font-size: 24px;
            text-align: right;
            text-decoration: none;
        }

        p {
            font-family: 'Lato', sans-serif;
            font-size: 30px;
        }

And this is the content inside the navigation bar (inside )

<div class="nav">
        <ul>
            <li><a href="#">Contacts</a></li>
            <li><a href="#">Map</a></li>
            <li><a href="#">Reservations</a></li>
            <li><a href="#">Online Order</a></li>
            <li><a href="#">Menu</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Home</a></li>
        </ul>
    </div>

    <div class="headerBreak"></div>

Note that this does not only apply to the navigation bar but also applies to my and

Reference: http://i.imgur.com/acnJE5Y.png Edit 1: I added this website to a free domain hoster, I have also added outline: none; to nav ul li a { but it still doesnt work when i open itbut when I duplicate the file and I open it the text does not have the blue outline, but in my original file it does

http://marcxu88.000webhostapp.com

If you could inspect the code and see if what is wrong it would be greatly appreciated.

Thanks in advance.

解决方案

Try adding outline: none; to the selector .nav ul li a.

这篇关于如何删除导航栏中的蓝色轮廓？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！