您好,登錄后才能下訂單哦!
小編給大家分享一下focus選擇器的使用方法,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
focus選擇器
:focus選擇器被用來指定“表單元素”獲得光標焦點時使用的樣式,主要在單行文本框text、多行文本框textarea等表單元素獲得焦點并輸入文本時使用。
一般情況下,獲取焦點和失去焦點是針對單行文本框text、多行文本框textarea這2個表單元素而言。
舉例:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CSS3 :focus選擇器</title> <style type="text/css"> input:focus { outline:1px solid red; } </style> </head> <body> <p><label for="name">姓名:</label><input type="text" name="name"/></p> <p><label for="email">郵箱:</label><input type="text" name="email"/></p> </body> </html>
效果如下:
分析:
在這里當文本框獲取焦點時,使用outline屬性為文本框添加一個紅色的外輪廓線,效果如下:
以上是focus選擇器的使用方法的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。