outline:none不用于输入标记

Kay*_*lly 3 html css twitter-bootstrap

可能重复:
为什么我不能删除Twitter Bootstrap中的蓝色textarea边框?

我为了摆脱输入字段上的突出显示所做的每一次搜索都说使用css:

input:focus {
    outline:none;
}
Run Code Online (Sandbox Code Playgroud)

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

我也在使用Bootstrap css库,我不确定这是否会导致这种问题.

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

任何帮助将不胜感激.

Kay*_*lly 8

解决方案对我有用

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;
}
Run Code Online (Sandbox Code Playgroud)

特别是修复问题的基本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;
}
Run Code Online (Sandbox Code Playgroud)

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


bap*_*tme 7

如果input{outline:none;}不起作用,请尝试:

input, input:focus{
  outline:0px !important;
  -webkit-appearance:none;
}
Run Code Online (Sandbox Code Playgroud)

  • 这帮助我按下按钮。特别是 !important。它甚至没有工作。原来这是因为引导程序覆盖了它。 (2认同)

Gra*_*ser 5

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

input
{
    outline:none;
}
Run Code Online (Sandbox Code Playgroud)