每當我單擊表單中的文本輸入時，就會出現一個綠色下劃線，它與我當前正在處理的網站的原色并不相符。我如何將它從綠色變為紫色？（> 圖片供參考，因為我的帖子中還不能包含圖片） https://i.stack.imgur.com/vEBk7.jpg
uj5u.com熱心網友回復：
- 這是主要思想，據我所知，我們有 3 個輸入狀態，
active,focus,hover.- 當您選擇它時，它處于活動模式，當您通過按鍵選擇它時，
tabs它處于焦點模式，而當您選擇它時mouseover，它處于懸停模式。 - 因此，要在這三種模式下修改 t 的樣式，我在示例中顯示了
input:focus,input:hover和input:active選擇器，然后應用 CSS。您可以使用它并在您的問題中應用相同的場景。 - 為了更好地理解，我還添加了所有三種模式。
.main { display: flex; align-items: center; justify-content: cenetr; flex-direction: column; height: 100vh; } .allstate>input, span input { border: none; border-bottom: 1px solid #c5c5c5; } .allstate>input:hover, .allstate>input:focus, .allstate>input:active { outline: none; border-bottom: 1px solid purple; } .modes { display: flex; flex-direction: column; gap: 15px; } .modes span input { display: block; width: 100%; } .active input:active, .hover input:hover, .focus input:focus { outline: none; border-bottom: 1px solid purple; }<div class="main"> <span class="allstate">All states: <input type="text" value="" placeholder="Enter some data" /></span> <div class="modes"> <span class="active">only active state: <input type="text" value="" placeholder="Enter some data" /></span> <span class="hover">only hover(mouse over) state: <input type="text" value="" placeholder="Enter some data" /></span> <span class="focus">only focus state: <input type="text" value="" placeholder="Enter some data" />(outline won't appear as it's focus only)</span> </div> </div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/497731.html
上一篇：一鍵獲取多個表單的值