如何刪除<input>邊框？

-1

我使用<input>對此我風格的邊界：如何刪除<input>邊框？

input { 
 
    font-size: 300%; 
 
    border-width: 10px; 
 
    border-style: solid; 
 
    border-radius: 30px; 
 
}

<input>

的問題是，一旦<input>具有焦點，會出現一個小小的藍色邊框：

我在DevTools的任何地方都看不到它，所以我認爲它屬於<input>本身，whi ch不打算有圓形邊框（瘋狂猜測）

是否有可能擺脫它？

來源

2017-10-11 WoJ

請不要刪除'outline'屬性 - http://a11yproject.com/posts/never-remove-css-outlines/ – sol

@ovokuro：爲什麼呢？（這是因爲在答案中提到的可訪問性？） – WoJ

是的，鍵盤用戶依賴於它提供的反饋。 – sol

您可以用outline:none將其刪除，但會創建accessibility issues。

input { 
 
    font-size: 300%; 
 
    border-width: 10px; 
 
    border-style: solid; 
 
    border-radius: 30px; 
 
    outline:none; 
 
}

<input>

2017-10-11 14:40:39

謝謝，我不知道無障礙點（良好的鏈接）。那麼我會保持這樣。 – WoJ

應該爲你

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

工作，但是這已經是在以下鏈接

2017-10-11 14:41:18

input:focus { 
 
    outline: none; 
 
}

更詳細

2017-10-11 14:41:53 vic

回答