2.如何使用DevTools触发CSS伪类

作者: 阿啦啦啦啦啦 | 来源:发表于2021-03-08 10:34 被阅读0次

pseudo-trigger.gif
可以触发元素上的伪类，以研究元素（例如，将元素悬停在元素上）如何反应。您可以右键单击“元素”面板中的节点，然后选择“强制元素状态”。或者，可以在“样式”子窗格中单击“切换”元素状态图标。

当一个元素应用了某种状态时，您将在节点的开始标签左侧看到一个视觉指示器，在某些情况下，也将在关闭标签左侧（如果它们相距很远）。

我们可以触发：活动类（:active），焦点类(:focus)，悬停类(:hover)和访问过的（:visited）伪类。

补充

一般伪类是:PseudoClass,伪元素是::PseudoElement,虽然伪元素也能写一个冒号，但是最好区分开来

2.如何使用DevTools触发CSS伪类
可以触发元素上的，以研究元素（例如，将元素悬停在元素上）如何反应。您可以右键单击“元素”面板中的节点，然后选择“...
Chrome DevTools调试技巧
【1】DevTools触发伪类右键单击Elements面板中的元素节点并选择“ force state ”。或者...
CSS
伪类的语法： CSS 类也可与伪类搭配使用。伪元素
css伪类(Pseudo-classes) & after be
anchor伪类 Eg：伪类和CSS类伪类可以与 CSS 类配合使用：在一个节点前后加节点
1.css基础
1.CSS的定义 2.如何编写CSS (优先级逐次降低) 3.CSS选择器综述 4.CSS伪类和伪元素 5.CSS...
CSS伪类：first-child
CSS 伪类用于向某些选择器添加特殊的效果。 CSS伪类的基础语法：当然，CSS类也可以与伪类搭配使用：在我第...
伪类和伪元素初探
Css3为了区分伪类和伪元素，伪类使用单冒号:，伪元素使用双冒号:: 常见伪类有 :hover,:link,:ac...
CSS细节问题总结------伪类
伪类 CSS伪类是用来添加一些选择器的特殊效果。（1）伪类可以与 CSS 类配合使用： a.red:visite...
css 应用总结
css伪类下面是自己使用过伪类的几种场景 :last-child 利用 css:last-child，实现循环...
CSS自带的伪类选择器
我们使用CSS自带的伪类选择器，从而可以更加方便的完成页面点击事件 css伪类选择器：分为静态和静态静态伪类只...