文章詳情頁
css3選擇器能否區(qū)分有輸入與無輸入的input?
瀏覽:157日期:2023-08-05 10:32:18
問題描述
例如用偽類:focus可以區(qū)分獲取焦點與無焦點的元素,并且是動態(tài)的我想在頁面input沒有輸入東西時一種表現(xiàn),當(dāng)用戶一輸入時又一種表現(xiàn),動態(tài)的,能用選擇器區(qū)分開來嗎?
問題解答
回答1:input 貌似沒有,但 placeholder 是可以部分自定義的,比如用來設(shè)個背景顏色啥的,這樣也達(dá)到了純 CSS 區(qū)分有無內(nèi)容目的。
::-webkit-input-placeholder { color: #000; background: red; border: 1px solid #000;}
不過呢,還可以考慮使用 <p contenteditable></p> 和 p:empty 來實現(xiàn)文本框和它的有無輸入的狀態(tài)。
<style> p:empty {color: #999; } p:empty::before {content: 'Empty'; }</style><p contenteditable></p>回答2:
沒有,這種效果用JS實現(xiàn)較為合適。
回答3:目前好像是沒有的,不過如果有的話肯定比 JS 方便
標(biāo)簽:
CSS
相關(guān)文章:
1. phpstudy8.1沒集成mysql-front2. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””3. node.js - mongodb查找子對象的名稱為某個值的對象的方法4. docker鏡像push報錯5. Docker for Mac 創(chuàng)建的dnsmasq容器連不上/不工作的問題6. javascript - 在 model里定義的 引用表模型時,model為undefined。7. 運行python程序時出現(xiàn)“應(yīng)用程序發(fā)生異常”的內(nèi)存錯誤?8. javascript - QQ第三方登錄的問題9. 利用IPMI遠(yuǎn)程安裝centos報錯!10. html5 - datatables 加載不出來數(shù)據(jù)。
排行榜

熱門標(biāo)簽
網(wǎng)公網(wǎng)安備