前端学习 -- Css -- 否定伪类

简介: 语法::not(.选择器)作用:可以从已选中的元素中剔除出某些元素。DOCTYPE html> p:not(.

语法::not(.选择器)

作用:可以从已选中的元素中剔除出某些元素。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            
            p:not(.soyoungboy){
                background-color: cadetblue;
                color: red
            }
            
        </style>
    </head>
    <body>
              
        <p>后海有树的院子</p>
        <p>夏代有工的玉</p>
        <p class="soyoungboy">此时此刻的云</p>
        <p>二十来岁的你</p>
    </body>
</html>

效果:

 

相关文章
|
22天前
|
缓存 前端开发
前端代码整洁与规范之CSS篇
【4月更文挑战第2天】 前端代码整洁与规范之CSS篇
41 4
|
1月前
|
前端开发
web前端-------伪类和伪元素
web前端-------伪类和伪元素
17 0
|
11天前
|
移动开发 前端开发 JavaScript
CSS选择器 前端开发入门笔记(十)
CSS选择器 前端开发入门笔记(十)
19 1
|
11天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
18 1
|
14天前
|
前端开发 JavaScript 搜索推荐
CSS框架是前端开发中不可或缺的工具
【4月更文挑战第12天】CSS框架是前端开发中不可或缺的工具
18 2
|
20天前
|
前端开发 JavaScript Java
通过学习mayfly,我学会了前端如何优雅设计字典值
`shigen`是一位擅长多种编程语言的博主,他在探索[mayfly-go](https://juejin.cn/post/7319365035552309248)项目后,发现了对枚举值管理的优雅设计。他分享了如何将字典和枚举值结构化,使用Vue+typescript实现更易维护的代码。通过创建`TagType`和`EnumValue`类,以及提供静态方法,实现了模块化和简洁的字典处理。示例展示了如何在页面中高效引用和显示字典数据,提高了代码的可读性和可维护性。
17 3
通过学习mayfly,我学会了前端如何优雅设计字典值
|
23天前
|
前端开发
css伪类伪元素都有哪些区别是什么
css伪类伪元素都有哪些区别是什么
9 0
|
24天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
N..
|
1月前
|
前端开发 UED
CSS伪类和伪元素
CSS伪类和伪元素
N..
7 0