Question

可能重复：
How come I can't remove the blue textarea border in Twitter Bootstrap?

我为了摆脱输入字段上的突出显示而进行的每次搜索都说使用css：

input:focus {
    outline:none;
}

这根本不起作用。我正在使用最新版本的chrome，firefox和safari来测试它。

我也在使用Bootstrap css库，我不确定这是否会导致这类问题。

我想要实现的效果是模拟控制台屏幕中的空白行。我有它的工作和完美的外观，除了inout字段聚焦时的亮点。

非常感谢任何帮助。

Answer 1

如果input{outline:none;}无效，请尝试：

input, input:focus{
  outline:0px !important;
  -webkit-appearance:none;
}

Answer 2

为我工作的解决方案

input, input:focus{
        position:absolute;
        width:auto;
        bottom:0px;
        padding:0px;
        margin:2px;
        background-color:#000000;
        color:#33FF00;
        border-width: 0px;
        outline:0; /* I have also tried outline:none */
        -webkit-appearance:none;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
}

特别是修复问题的基本css：

input, input:focus{
        border-width: 0px;
        outline:0; /* I have also tried outline:none */
        -webkit-appearance:none;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
}

我原本忘记将盒子阴影设置为无。

Answer 3

不要将它附加到:focus伪事件。

input
{
    outline:none;
}

Answer 4

试试这样：

input {
    outline:none;
}

在我的网站上为我工作。如果它不适合你，试着提供一个小提琴。

outline：none不用于输入标记

4 个答案: