Question

文本框border-style已初始化为none。但是聚焦边框会出现在textBox上。那么，如何避免边框出现？

＆＃13;

input[type="text"]{
  
   border-style : none;
   box-shadow :  0 0 0 0;
   height : 3em;
   width : 20em;
 }

::-webkit-input-placeholder { 
  font-size : 16pt;
}

::-moz-placeholder { 
  font-size : 16pt;
}

＆＃13;

<label for='text'>Enter some text</label><br>

<input type="text" placeholder="Enter text here">

＆＃13;

Answer 1

在这里你有办法，outline : none;应该添加到：

input[type="text"]{
  
   border-style : none;
   box-shadow :  0 0 0 0;
   height : 3em;
   width : 20em;
   outline : none;
 }

::-webkit-input-placeholder { 
  font-size : 16pt;
}

::-moz-placeholder { 
  font-size : 16pt;
}

<label for='text'>Enter some text</label><br>

<input type="text" placeholder="Enter text here">

Answer 2

为此设置大纲为无。

input:focus{
    outline: none;
}

示例代码段。

<!DOCTYPE html>
<html>

<head>
    <style>
        input {
            border: none;
        }
        
        input:focus {
            outline: none;
        }
    </style>
</head>

<body style="font-family:sans-serif">
    <label for='text'>Enter some text</label>
    <br>

    <input type="text" placeholder="Enter text here">
</body>

</html>

避免使用文本框Border onfocus？

2 个答案: