Bootstrap Navbar 有奇怪的细线边框答案

【问题标题】：Bootstrap Navbar has strange hairline borderBootstrap Navbar 有奇怪的细线边框
【发布时间】：2017-10-12 18:13:53
【问题描述】：

我已尽一切努力摆脱这条血腥的发际线，包括 this post 和 this post 的技术，但没有肥皂。这是我正在处理的图像：

它跨越了页面的整个页眉，出于对 webby 一切的热爱，我无法找到它的来源！只是具有透明背景的基本导航栏。我已经在 devtools 中查看了整个 CSS 列表，我发现最接近的是 .navbar-default .navbar-collapse, .navbar-default .navbar-form 上的 border-color，我尝试将其更改为无效。

在这个阶段欢迎任何启蒙。蒂亚！

写！

【问题讨论】：

你的border-width设置为0px吗？
在哪个选择器上？ .导航栏？是的。
发布您的代码或更好的工作代码笔将是最有帮助的。
复制那个。我今天晚些时候再做。
好的。这是代码笔。不知道为什么菜单现在是垂直的，但这不是重点。发际线像白天一样平淡无奇。 codepen.io/iansebryk/pen/RLBbQv

标签： css twitter-bootstrap navbar

【解决方案1】：

.navbar-default 有一个 box-shadow，这是你可以看到的：

-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);

在您自己的 CSS 中覆盖它以摆脱该行：

-webkit-box-shadow: none;
box-shadow: none;

这是Codepen。

【讨论】：

那是那只兔子……从来没想过要检查！谢谢你。并为花了这么长时间回复而道歉。 :P