html5 - css not选择器
怪我咯
怪我咯 2017-04-17 14:47:10
[HTML讨论组]

1.我现在有一个弹层,里面有一些输入框 如果判断条件不通过输入框就会变成红色,

但是弹层里面也包含弹层 如果直接点击确定按钮 弹层里面的弹层输入框也会变成红色

所以我 .is-error:not(.userSelectModal) input{ border: solid 1px #D90000;}这样写 但是不生效 假如去掉input是可以的,这是什么原因造成的呢?

ps:代码结构

怪我咯
怪我咯

走同样的路,发现不同的人生

全部回复(3)
PHPz

所以我 .is-error:not(.userSelectModal) input{ border: solid 1px #D90000;}这样写 但是不生效 假如去掉input是可以的,这是什么原因造成的呢?

空一格就是包含选择符了(即E F这种形式的),命中的是E后代的所有F元素。按你的这个思路,input应该是放在前边的,变成:

input.is-error:not(.userSelectModal) {border: solid 1px #D90000;}

应该就没问题了。

大家讲道理

你的is-error这个类是添加到input上面的吧??

大家讲道理

题主用的选择器not,是排除选择器,意思是除了被选择器选中的元素之外的元素,会添加上后面的样式。
.is-error:not(.userSelectModal) input指的是有.is-error这个名字但是没有.userSelectModal这个名字的input元素(注意,两者要同时满足!!),所以问题来了,你的.userSelectModal元素并没有.is-error这个名,这只是这个选择器的问题。希望我的回答对题并且对你有帮助,谢谢!!

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号