CSS实现获取input焦点，改变父元素或者兄弟元素
温馨提示：
本文最后更新于 2023年04月10日，已超过 382 天没有更新。若文章内的图片失效（无法正常加载），请留言反馈或直接联系我。
:focus-within 伪类
表示一个元素获取焦点，或该元素的后代元素获得焦点。元素自身或者它的某个后代匹配 :focus 伪类。（shadow DOM 树 (en-US)中的后代也包括在内）
.div_class:focus-within {
input {
border: 1px solid #999; color: #999;
}
} div_class作为父元素，当input子元素获得焦点时，父元素focus-within也能触发。因此进行父元素及父元素下的其他子元素的操作，相当于用父元素来监控子元素。
改变兄弟元素样式
input:focus~.input_btn {
border: 1px solid blue; color:blue;
} 比如input和input_btn是兄弟元素，可以直接进行操作兄弟元素。
正文到此结束
- 本文标签： 前端 css
- 本文链接： http://www.92cxy.cn/article/99
- 版权声明： 本文由王小东原创发布，转载请遵循《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权
热门推荐
相关文章
该篇文章的评论功能已被站长关闭
