css - 引导选择上的蓝色轮廓

Question

我已经安装了 bootstrap-select 并且一切正常，除了蓝色边框出现在 2 个实例中：

1) 在下拉菜单中

在此处输入图像描述

2) 选择新值时

在此处输入图像描述

有人可以帮忙解决它吗？我已经调整了一些东西。

.bootstrap-select .btn {
  height: 43px;
  color: rgba(0, 0, 0, 0.5);
  background-color: white;
  border-radius: 3px;
}
.bootstrap-select .btn:focus {
  outline: none !important;
  outline: 5px auto -webkit-focus-ring-color !important;
}

score 4 · Accepted Answer

在所有其他 CSS 样式之后应用这两个 CSS 规则

.bootstrap-select .dropdown-toggle:focus {
    outline: none!important;
}
:focus {
  outline: none!important;
}

score 1 · Accepted Answer

1

outline: 0;

如果您针对正确的项目，应该修复它。

于 2014-08-17T18:35:15.113 回答

score 1 · Accepted Answer

1

添加CSS

.bootstrap-select.btn-group .dropdown-menu li a {
  outline: none;
}

于 2016-01-10T20:36:01.003 回答

score 0 · Accepted Answer

0

尝试将此添加到您的CSS：

:focus {
  outline: none;
}

于 2014-08-17T17:27:42.547 回答

score 0 · Accepted Answer

移除元素周围的蓝色轮廓及其内部的项目：

<style>
    .bootstrap-select .btn:focus {
        outline: none !important;
    }

    .selectpicker a {
        outline: 0;
    }
</style>

在 Chrome、Firefox 和 Opera 上测试。

score 0 · Accepted Answer

将它添加到我的 HTML 的最底部是最终在 Chrome 上对我有用的东西：

<style type="text/css">
    .bootstrap-select .dropdown-toggle:focus {
        outline: none !important;
        box-shadow: none !important;
    }
    :focus {
      outline: none !important;
      box-shadow: none !important;
    }
</style>

我认为关键是我在设置 CSS 后加载了 Bootstrap 和其他库。

css - 引导选择上的蓝色轮廓

6 回答 6

Related

Reference