去除input邊框

去除input邊框

input去除邊框

去除input框獲取焦點時的藍色外邊框

@ sunrainamazing

去除input的邊框僅僅用border屬性 ，其實是不能滿足我們的需求的

此外還需要加上outline屬性才可以 實現我們想要的樣式 **

如下圖展示：

邊框input3 獲取焦點的樣式

很明顯，有乙個淡藍色的外邊框在上面

因此，需要 新增 ,去除input的外邊線框，如下

原文連線

outline：none

或 outline:medium;

charset="utf-8">

去除input的邊框title>
input
#search1
#search2
#search3
#search4
/*獲取焦點時 外邊框顯示紅色*/
#search4
:focus
#search5
:focus
; } 
style>
head>
type="text"
id="search1"
name="search"
placeholder="請輸入搜尋內容1" />
type="text"
id="search2"
name="search"
placeholder="請輸入搜尋內容2" />
type="text"
id="search3"
name="search"
placeholder="請輸入搜尋內容3" />
type="text"
id="search4"
name="search"
placeholder="請輸入搜尋內容4" />
type="text"
id="search5"
name="search"
placeholder="請輸入搜尋內容5" />
body>
html>

input去除藍色邊框

input標籤在使用的時候會有邊框樣式。當input聚焦的時候又會顯示出乙個藍色邊框。很多時候我們並不需要這種預設樣式的邊框，就需要去除邊框。給需要去除的標籤新增css樣式 border none 去除input預設的邊框 outline none 去除聚焦時的藍色邊框 outline width ...

去除input標籤focus時藍色邊框

問題 當使用input標籤時，它會有乙個預設樣式，即當其獲取到焦點時，會有乙個藍色邊框效果。如下圖 未獲取焦點時 獲取到焦點時 我們在控制台檢視input focus如下圖。發現並沒有相關的樣式。事實上這是input的outline屬性帶來的問題。當我們加上 input 就能解決這個問題。同樣有這個...

input邊框隱藏

border style none,比border left 0 border right 0 border top 0 border bottom 0 有效果，因為後者有的實現不了功能。form表單中，有的時候需要隱藏邊框，然後用下劃線代替，1 設定input下邊框為紅色 2 設定input外的t...