文章详情页
css3选择器能否区分有输入与无输入的input?
浏览:128日期:2023-08-05 10:32:18
问题描述
例如用伪类:focus可以区分获取焦点与无焦点的元素,并且是动态的我想在页面input没有输入东西时一种表现,当用户一输入时又一种表现,动态的,能用选择器区分开来吗?
问题解答
回答1:input 貌似沒有,但 placeholder 是可以部分自定義的,比如用來設個背景顏色啥的,這樣也達到了純 CSS 區分有無內容目的。
::-webkit-input-placeholder { color: #000; background: red; border: 1px solid #000;}
不過呢,還可以考慮使用 <p contenteditable></p> 和 p:empty 來實現文本框和它的有無輸入的狀態。
<style> p:empty {color: #999; } p:empty::before {content: 'Empty'; }</style><p contenteditable></p>回答2:
没有,这种效果用JS实现较为合适。
回答3:目前好像是没有的,不过如果有的话肯定比 JS 方便
标签:
CSS
相关文章:
1. javascript - 一排三个框,各个框的间距是15px,距离外面的白框间距也是15px,这个css怎么写?2. javascript - Vue 的依赖追踪属于单向数据绑定还是双向绑定?3. html5 - javascript写业务有用到什么编程范式没?4. javascript - vue 数据更新了。但是dom没有更新,,,,,如图5. javascript - jQuery post()方法,里面的请求串可以转换为GBK编码么?可以的话怎样转换?6. javascript - vue 手机端项目在进入主页后 在进入子页面,直接按返回出现空白情况7. 网页爬虫 - python爬虫翻页问题,请问各位大神我这段代码怎样翻页,还有价格要登陆后才能看到,应该怎么解决8. html5 - vue-cli 装好了 新建项目的好了,找不到项目是怎么回事?9. mysql - C#连接数据库时一直这一句出问题int i = cmd.ExecuteNonQuery();10. javascript - 哪位大神指导下,如何实现今日头条头部导航列表,点那个类型,哪种类型就居中了?
排行榜

网公网安备