纯CSS实现:为包含特定类的元素添加另一个类 - 无需JavaScript
使用CSS的伪类选择器来实现这个效果。首先,我们可以使用:has伪类选择器来选择包含特定类的元素。然后,我们可以使用+相邻兄弟选择器来选取这个元素的下一个兄弟元素,即含有.mdui-snackbar-action类的元素。最后,我们可以使用classList属性的add方法来动态添加.waves-light类。下面是实现这个效果的CSS代码:css :has(.mdui-snackbar-action) + .mdui-snackbar-action { /* 添加.waves-light类 */ /* 以下为.waves-light类的样式示例,可以根据需要修改 */ background-color: #2196F3; color: #fff; padding: 10px; } 在上面的代码中,我们假设.mdui-snackbar-action类的元素是.mdui-snackbar元素的下一个兄弟元素。如果不是下一个兄弟元素,可以根据实际情况调整选择器。请注意,:has伪类选择器在目前的CSS规范中并没有得到广泛支持,所以在一些浏览器中可能不起作用。如果需要在不支持的浏览器中实现该效果,可以考虑使用JavaScript来添加类名。
原文地址: https://www.cveoy.top/t/topic/p2bT 著作权归作者所有。请勿转载和采集!