CSS點擊搜索框無邊框

input[type=text] {
border: none;
outline: none;
background-color: transparent;
}

使用CSS制作一個漂亮的搜索框，當點擊搜索框后邊框消失，看上去更加簡潔美觀。

首先，我們需要使用HTML代碼創建一個輸入框，如下：

<input type="text" placeholder="搜索" />

接下來，我們需要使用CSS樣式來控制搜索框的樣式。首先，我們可以使用border:none屬性來隱藏輸入框的邊框，如下：

input[type=text] {
border: none;
}

接下來，我們需要為輸入框添加一個虛線邊框，我們可以使用outline:none屬性來隱藏邊框，如下：

input[type=text] {
border: none;
outline: none;
}

最后，我們需要為輸入框添加一個透明的背景色，使其看起來更加美觀。我們可以使用background-color:transparent屬性來設置輸入框背景色為透明，如下：

input[type=text] {
border: none;
outline: none;
background-color: transparent;
}

這樣，我們就成功地使用了CSS制作一個漂亮的搜索框，并且當點擊搜索框后，邊框消失，看上去更加簡潔美觀。