伪-Pseudo是一个选择设备。Mozilla解释了伪 - 类别:
伪类是一种选择。它用于在特定状态下选择元素。例如,当它们是这种类型的第一个元素时,或者将鼠标指针悬挂在元素上时。它们的性能像您适用于文档的某个部分的类,帮助您减少标签文本中的多余类别,制作您的代码更灵活,更易于维护。
伪grammar:单个代码 +伪 - 名称,例如,如下
: 第一个孩子
: 最后一个孩子
伪元素类似于伪-Type,但是它可以像您在标记文本中添加新的HTML元素一样执行,而不是将类别添加到现有元素中。经常用CSS写。
伪元素的语法:例如,双结肠 +伪元素名称,如下:
:: 第一行
:: 前
防范措施
1.在选择器中只能使用一个伪元素。伪元素必须遵循语句中的简单选择器/基本选择器。
2.根据规格,应使用双结肠(::)而不是单个结肠(:)区分伪级和伪元素。目前,大多数浏览器都支持使用这两种方法来表示伪元素。单个菌落是CSS2的语法,而双级别的语法是CSS3的语法。
主要浏览器中的伪元素单和双结肠语法的支持:
伪 -类别将添加页面中存在的类(类),并且伪元素添加了不在页面中的元素,但请注意,此添加的元素不会添加到文档树中,只是视觉效果。
提示:总共计算了60种伪类别。
提示:总共计算了12个伪元素。
①:悬停
通常用于鼠标悬架事件的方法,例如鼠标悬挂时鼠标悬挂的按钮,元素变色或自动扩展菜单,或者及时弹出菜单。最常用的伪类别。
以下是Mozilla的解释:Hover:Hover:
:悬停CSS伪级,适用于用户使用指令设备参考情况(没有激活)。这种样式由与链接相关的任何伪级重写,例如:link,:link,:visite,:active:active and:active,以确保有效性,需要放置悬停规则之后:链接和:访问的规则,但以前:根据LVHA的顺序,主动规则:link-:link-:访问 - 访问 - :悬停 - 悬停 - :活动。
提示:在触摸屏上:悬停存在问题,基本上没有可用。不同
以下是用法的示例:
②:活动
:主动伪 - 匹配用户激活的匹配元素。它允许在监视浏览器时该页面给出反馈。与鼠标进行交互时,它表示用户之间按键并松开键之间的时间。
以下是Mozilla激活链接的一个示例:
效应图:
③:最后一个孩子
:最后一个孩子,CSS伪级,代表父元素的最后一个子元素。
我还会更多地使用它,通常以删除最后一个元素的边框,或处理周期生成的相同类型元素的最后一个元素样式。
循环生成的li:
④:第一子女
:第一儿童,CSS伪级,指示了一组兄弟元素中的第一个元素。
用法和应用程序方案与以下儿童相似。区别是第一个是尾巴。
⑤:不()
css pseudo -pategory:not(),用于匹配不匹配一组选择器的元素。由于其作用是防止选择特定元素,也称为抗选项pseudo -pseudo
以下是用法的示例:
⑥:必需
:必需的CSS伪级 - 表明所需属性是任意设置的。此伪对在提交表单之前必须具有有效数据的字段非常有用。
用法如下:
⑦:聚焦
CSS伪:焦点,指示焦点的焦点(例如表单输入)。当用户单击或触摸元素或通过键盘“ TAB”键选择时,将触发它。
以下是用法的示例:
以下是效应图:
⑧:nth-child()
:nth-child(an+b)此css pseudo-class首先找到所有当前元素的兄弟元素,然后按位置顺序从1中排序。B)匹配元素集(n = 0,1,,2,3 ...)。
该伪类别有时非常有用。我制作的场景是为不同的词汇设置不同的颜色,这与单词云有点相似。该词可以与等效比率,等效的配额公式或其他数学表达式结合使用。
以下是Mozilla的解释:
A和B必须是整数,并且该元素的元素的第一个子元素是1.换句话说,伪类 - 类与集合中的子元素匹配{an + b;n = 0,1,2,...}。此外,重要的是要注意必须在B前写一个,不能以B+An的形式写入。
::用来创建伪元素作为所选元素的最后一个子元素的用途。总体而言,内容属性用于将装饰内容添加到元素中。此虚拟元素默认为in -line elements。例如在DIV“→”或“ ...”的后面添加一个小图标:
以下是Mozilla上一个非常有趣的例子:
此示例的效果:
提示:此示例巧妙地使用了以下知识点:
①数据属性名称,HTML自定义元素属性语法
pseudo类别和伪元素的组合
③attr(attribute-name),该函数返回选择元素的属性值,该值通常用于动态悬架提示。
:: Backdrop CSS伪元素是一个框,它以完整屏幕模式以任何元素呈现。但是请注意,这是实验中的一个函数。您需要注意浏览器的支持。
下一个是一个示例和渲染,可以改变视频的完整屏幕背景颜色
类似于::之后,它只是前一个中的一个。内容属性。此元素默认为行中的元素。
这是一些语法示例
:: CUE CSS伪元素匹配Webvtt提示的选定元素。该元素可用于使用VTT轨道媒体中的字幕和其他线索。
CSS的一小部分可以与::提示伪元素一起使用:颜色,不透明度,可见性,文本传递,文本阴影,背景,宽度等。
::首先会选择块级元素的第一行的第一个字母,并且在文本行之前没有其他内容(例如图片和内部公式)。
在块级元素的第一行应用程序样式中
以下是将每个P标签中的第一行英语字符转换为大写:
效应图:
1.在CSS3之后,为了区分伪类阶级和元素,使用伪-CLAN编号用于标准化伪-Clan,伪元素由Dual Colon表示。CSS2仍受到许多现代浏览器的支持)
2.伪 - 类别将添加页面中存在的类(类),并且页面中的元素(元素)添加了伪元素,但应注意,此添加的元素不会添加到文档树。这只是一个视觉效果。
