css中的伪类和伪元素

最新推荐文章于 2024-04-25 22:37:35 发布
最新推荐文章于 2024-04-25 22:37:35 发布
阅读量211 收藏
点赞数
文章标签： css 前端 css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45093753/article/details/127205540
版权

（1）伪元素仅指::after与::before，创建了一个新元素，这个新元素是前面的元素的子元素，这个子元素是一个块级盒子。
（2）这个子元素虽然在逻辑上存在，但却并不实际存在于文档树中。不会出现在DOM中，所以不能通过js来操作，仅仅是在 CSS 渲染层加入。
（3）每个选择器最多只能有一个伪元素，但是可以有多个伪类。
（4）伪类有链接伪类和结构伪类。链接伪类跟在a标签后面，例如🅰️hover。结构伪类指div:nth-child(n)等

weixin_45093753
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
浅谈CSS伪类与伪元素
09-25
本文向大家展示了CSS的伪类与伪元素，介绍的非常全面，这里推荐给大家参考下。
Web前端——CSS伪类和伪元素
qq_25592087的博客
09-27 1655
可以理解为描述元素的某种状态，用于当已有元素处于的某个状态时，为其添加对应的样式，这个状态是根据用户行为而动态变化的。可以理解为某个元素的子元素，但不存在于html中。用于创建一些不在文档树中的元素，并为其添加样式。标签::伪类{设置的样式，伪类可以与 CSS 类配合使用}标签:伪类{设置的样式，伪类可以与 CSS 类配合使用}
CSS的伪类和伪元素
嘿嘿
04-13 648
之前介绍了8种选择器,基本上可以应对大部分的开发需求，但是如果不会使用伪类和伪元素，就跟下面的图差不多，后面会摔的。伪元素和伪类虽然不是特别常用，但是，很好用，可以帮你省掉很多无用功，效果还好。下面直接进入正题，尽量用最小的篇幅让人明白如何使用它们。 ... 1.伪元素和伪类的区别 伪元素和伪类都是为了给一些特殊需求加样式，定义上基本一致。 伪类像类选择器一样给已存在某个元素添加...
CSS中的 5 类常见伪元素详解！
最新发布
u013179804的博客
04-25 1064
CSS 伪元素用于创建特定的特殊效果，它们可以用于选择和样式化元素的某些部分，这些部分在文档树中并不存在作为可访问的元素节点。伪元素主要用于添加装饰性的效果，例如添加前缀内容、创建边框效果等。而前文的伪类CSS伪类大全！4大类伪类详解用于根据特定条件为已有元素添加样式，它们描述了元素的某个状态，如:hover:focus等。伪元素在 CSS 中使用两个冒号（ok，那我们一起来看看吧。
CSS 伪类和伪元素详解及区别
weixin_48723799的博客
05-14 272
CSS 伪类是用来选择处于特定状态的元素，比如说鼠标悬浮在元素上面、元素被点击等等。:hover鼠标悬浮在元素上时:active元素被点击时:focus元素获得焦点时:visited访问过的链接选择元素的某个子元素a:hover {color: red;这个样式表示当鼠标悬浮在链接上时，链接文本的颜色会变成红色。CSS 伪元素则是用来选择某个元素的特定部分，比如说元素的第一行或第一个字母。::before在元素前面插入内容::after在元素后面插入内容选择元素的第一行。
伪类 伪元素
日积月累的博客
08-18 194
伪类：用于已有元素处于某种状态时为其添加对应的样式，这个状态是根据用户行为而动态变化的。 例如：当用户悬停在指定元素时，可以通过:hover来描述这个元素的状态，虽然它和一般css相似，可以为已有元素添加样式，但是它只有处于DOM树无法描述的状态下才能为元素添加样式，所以称为伪类。 CSS3对伪类的定义 伪类存在的意义是为了通过选择器找到那些不存在与DOM树中的信息以及不能被常规CSS选择器获取到的信息。 伪类由一个冒号:开头，冒号后面是伪类的名称和包含在圆括号中的可选参数。 任何常规选
前端面试题总结（4）
wuyxinu的博客
06-21 8567
一、题目 1、以下代码执行后，console 输出的信息是？ for(let i = 0; i < 5; i++){ requestAnimationFrame(() => console.log(i)); } 2、以下代码中文字的最终颜色是 <style> div > #title{color: blue;} div > h3#title.title{color: red;} [lang="en"] h3.title{color: g
css3 伪元素和伪类选择器详解
09-25
无论是伪类还是伪元素，都属于CSS选择器的范畴。所以它们的定义可以在CSS标准的选择器章节找到。分别是 CSS2.1 Selectors 和 CSS Selector Level 3，两者都已经是推荐标准。
CSS伪类和伪元素的区别详解
09-25
伪类和伪元素不是真正意义上的html存在的类和元素,他们的存在是为了方便对状态和位置进行样式定义。具体他们之间有什么区别呢，这就是今天我们需要讨论的问题了
【CSS 知识总结】第四篇 - CSS 选择器-伪类和伪元素
BraveWangDev
03-20 2184
CSS 的三大特征；CSS 选择器的优先级；CSS 优先级的计算规则；CSS 选择器的权重；CSS 选择器面试题；本篇，介绍 CSS 选择器：伪类和伪元素；伪类用于定义元素的特殊状态；同一元素，根据不同状态，显示不同样式，样式随状态（用户行为）变化而变化；与普通 CSS 类相比较，伪类选择器只有处于 dom 树无法描述的状态下，才能为元素添加样式；所以被称作伪类；CSS 伪元素用于设置元素指定部分的样式；；
学习笔记---css中伪元素与伪类（迷惑我的:after与:hover）
近未来
08-24 9160
一直被伪类与伪元素所迷惑，以为是同一个属性名称，这两天看css动画，越来越多的看到诸如   a:hover:after，a.hover:after 的用法，越来越糊涂，索性翻翻定义研究研究。   本文出现的伪类伪元素均为css2、css1中内容。css3中伪类、伪元素还未做整理。     先看定义： 伪元素：（pseudo-element）是HTML 中并不存在的元素。用于将特殊的效果...
题库练习总结（一）
qq_43194919的博客
04-30 797
驼峰命名 驼峰命名式分为大驼峰和小驼峰 大驼峰样式：TypesOfFish 小驼峰样式：typesOfFish title属性 title归档关于元素的额外信息，鼠标放上出会出现提示性文本 拖放 在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。 <!DOCTYPE HTML> <html> <head> <style type="text/...
说说伪类与伪元素的不同
weixin_30735391的博客
04-09 137
说说伪类与伪元素的不同 伪元素用来创建HTML文档语言指定之外文档树的抽象层。比如HTML没有提供文档元素内容的首字母或第一行的访问机制。CSS伪元素允许作者引用这些除此之外无法访问的信息。伪元素还提供一种方法来引用不存在于文档中的内容。（比如，::before和::after）。 一个伪元素由2个冒号（::）加上伪元素的名字所定义。 每个选择器中只能出现一个伪元素，并且只能出现在选择...
CSS的伪元素和伪类的区别
知了只有一夏
03-02 4059
其实明白过来以后，再回头去想为什么自己会混淆伪元素（pseudo-elements）和伪类（pseudo-classes）的概念，反而会觉得难以理解。毕竟，单从名字就能拿一眼看出它们的区别，一个是假的元素，另一个是假的类。 1. 温故一下什么是元素，什么是类 元素指的是 HTML 文档中的标签，它是 DOM 树的一部分。而类是元素上的一个属性，是人为规定的当前元素的一个类别。 CSS 选择器有...
两个“虚伪”的“人”------伪元素选择器&伪类选择器
Sam.LIU的博客
07-07 1525
Css2中对于伪类的定义     css伪类用于向某些选择器添加特殊的效果Css3中对于伪类的定义     伪类存在的意义是为了通过选择器找到那些不存在与DOM树中的信息以及不能被常规css选择器获取到的信息；     由一个冒号开头，冒号后面是伪类的名称和包含在圆括号中的可选参数           Css2中对于伪元素的定义             css伪元素用于向某些选择器设置特殊效果...
80道前端面试经典选择题
热门推荐
qq_40588413的博客
02-08 1万+
前言 看了一下各种面试题，选择题是必有的 所以我整理了一些经典的前端面试选择题，希望能对大家日后找工作有所帮助！ HTML/CSS 1、在 css 选择器当中，优先级排序正确的是（） A、id选择器>标签选择器>类选择器 B、标签选择器>类选择器>id选择器 C、类选择器>标签选择器>id选择器 D、id选择器>类选择器>标签选择器 解析： 选D...
CSS3伪类与伪元素的区别及注意事项
尐轩web前端网络日志
12-10 1万+
CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别定义首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类：用于向某些选择器添加特殊的效果 伪元素：用于将特殊的效果添加到某些选择器 讲道理，可能我语文不好，我觉得这两句话是等价的 :-) 根本不能看出有什么区别 都是对某些选择器“加特技”标准有这么一句话翻译过来是这样的 CSS 引入伪类和伪元素的概
css多个伪元素,使用CSS伪元素控制连续几个元素的样式方法
weixin_36378683的博客
08-03 762
用CSS伪元素控制元素的时候经常性的需要改变一些元素的样式，网上有许多博客都说了如何去控制一个的改变，但是我在实际写的过程中，发现更多时候是需要控制多个连续元素的改变。使用伪元素去控制(以:hover为例)，当鼠标停留在A时，BCD.....样式的改变A与BCD....是相邻同级关系，要求A在BCD的最上面//相应用A控制BCD的CSS代码.A:hover + .B{background-colo...
css 伪元素和伪类
01-25
CSS中的伪类和伪元素是用来选择文档中特定元素的一种方式。它们可以帮助我们对元素进行样式化或者添加特定的效果。伪类和伪元素的区别在于它们的语法和作用对象。 1. 伪类（Pseudo-classes）：伪类用于选择处于特定...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值