问题

This question already has an answer here:

任何人都可以解释如何清除文字/输入框周围的橙色或蓝色边框(轮廓)?我认为只有在Chrome上才会显示输入框处于活动状态.这里是我使用的输入CSS:

input {
    background-color: transparent;
    border: 0px solid;
    height: 20px;
    width: 160px;
    color: #CCC;
}

在这里输入图片说明



解决方法

此边框用于表示元素已聚焦(即您可以输入输入内容,或按Enter键).您可以删除它,但:

textarea:focus, input:focus{
    outline: none;
}

您可能想为用户添加一些其他方式,以便了解哪些元素具有键盘焦点,但是对于可用性而言.

Chrome还会将突出显示应用于其他元素,例如用作模态的DIV.要防止这些和所有其他元素上的突出显示,您可以执行以下操作:

*:focus {
    outline: none;
}



相关问题推荐