① div p:first-of-type :选择 div 下的第1个子元素p; ② div p:nth-of-type(2) :选择 div 下的第2个子元素p。 4 结构伪类选择器的比较 5 伪元素选择器 伪元素选择器可以利用css创建新标签,简化HTML结构。 伪元素选择器的基础语法如下表: 需要注意的地方如下: (1)创建的标签属于行内元素; (2)...
从上述例子中可以看出,伪类的操作对象是文档树中已有的元素,而伪元素则创建了一个文档数外的元素。因此,伪类与伪元素的区别在于:有没有创建一个文档树之外的元素。 3.伪元素是使用单冒号还是双冒号? CSS3规范中的要求使用双冒号(::)表示伪元素,以此来区分伪元素和伪类,比如::before和::after等伪元素使用双冒号...
3、empty伪类 选择没有子元素(包含文本节点)的元素 4、root伪类 选择文档树中的第一个元素,在HTML中,root永远是html元素,使用root可以将html元素赋予更高的特殊度 5、not伪类 E:not(F){} 选择除了作为参数值给出的元素之外的所有元素 传入not伪类的参数都必须是一个简单选择器 伪元素: 1、CSS2中: :first-...
51CTO博客已为您找到关于css3中新增的伪类的相关内容,包含IT学习相关文档代码介绍、相关教程视频课程,以及css3中新增的伪类问答内容。更多css3中新增的伪类相关解答可以来51CTO博客参与分享和学习,帮助广大IT技术人实现成长和进步。
伪元素是CSS3新增的, 用 :: 来表示伪元素(IE9). p::before{ content: "哈哈" --- 必须存在, 表示要添加的文本, 不需要添加文字可写 "" } p::after{ content: "哈哈" --- 必须存在, 表示要添加的文本, 不需要添加文字可写 "" } ::before 和 ::after 默认是行内元素, 必要时要转块(脱离标准...
属性选择符新增: E[attr ~="val"]E[attr |="val"]E[attr ^="val"] E[attr $="val"]E[attr *="val"] 伪元素选择符新增 E::placeholder E::selection 伪类选择器新增 E:not(s):rootE:target E:first-childE:last-childE:only-childE:nth-child(n)E:nth-last-child(n) ...
比如我想要在一串列表中选择出奇数项和偶数项元素,分别设置不同的背景颜色,此时就需要结构伪类选择器登场了。 结构伪类选择器可以按下标选出指定项,比如第一项 :first-child,最后一项 :last-child,奇数项 :nth-child(even),偶数项 :nth-child(odd),第任何一项 :nth-child(n) ...
伪类将应用于元素带有指定lang的情况。 伪元素选择器 伪元素选择器:伪元素的效果是需要通过添加一个实际的元素才能达到的。 CSS中有如下四种伪元素选择器: `:first-line:`为某个元素的第一行文字使用样式; `:first-letter:`为某个元素中的文字的首字母或第一个字使用样式; ...
和child的区别是选中属于这个类型选择器的第几个元素。 代码如下: 5.css3新增的伪元素选择器:(before ,after) 代码示例:(before和after) 因为伪类元素插入的是行内元素,所以不能调整宽高,需要变成块级元素才能正常调整宽高 注意事项:(dom涉及到了javascript) ...
CSS3新增选择器:可以更加便捷自由的选择目标元素。 新增选择器种类:属性选择器、结构伪类选择器、伪元素选择器。 属性选择器 顾名思义,就是根据元素的属性及其属性值来确定目标元素。 1.根据属性名确定元素:不使用类选择器或ID选择器,省去命名烦恼。