美文网首页
CSS3选择器

CSS3选择器

作者: 璐璐熙可 | 来源:发表于2018-06-01 19:53 被阅读208次

CSS3 属性选择器

1.E [attr]

只使用属性名,但没有确定任何属性值

2.E [attr="value"]

指定属性名,并指定了该属性的属性值

3.E [attr~="value"]

指定属性名,并且具有属性值,此属性值是一个词列表,其中词列表中包含了一个value词,而且等号前面的“〜”不能不写

4.E [attr^="value"]

指定了属性名,并且有属性值,属性值是以value开头的

CSS3 结构性伪类

1.E:nth-child(n)

表示E父元素中的第n个子节点(从 1 开始)
参数也可以是一个表达式,2n+1 -> 匹配第奇数个子元素,n 从 0 开始

2.E:nth-last-child(n)

表示E父元素中的第n个子节点,从后向前计算

3.E:first-child

表示E父元素中的第一个子节点

4.E:last-child

表示E父元素中的最后一个子节点

注意(选择器: nth-of-type和nth-last-of-type选择器来避免这类问题的发生。使用这两个选择器时,css3在计算子元素是第奇数个子元素还是第偶数个子元素时,就只针对同类型的子元素进行计算了。)

5.E:nth-of-type(n)

表示E元素中的第n个子节点,且类型为E

6.E:nth-last-of-type(n)

表示E元素中的第n个字节点,且类型为E , 从后向前计算

7.E:first-of-type

表示E元素中的第一个子节点且节点类型是E的

8.E:last-of-type

表示E元素中的最后一个子节点且节点类型是E的

CSS3 其他伪元素

1.E:before

生成内容在E元素前

2.E:after

生成内容在E元素后

3.E :not(selector)

表示匹配E元素中除了 selector 的元素

相关文章

  • CSS3知识概要总结之选择器篇(二)

    是的,从这里开始我们就开始学习CSS3的选择器了,学习资源CSS3选择器 属性选择器 属性选择器 发现属性选择器真...

  • HTML5和CSS3新增内容

    CSS3选择器有哪些? 属性选择器、伪类选择器、伪元素选择器。 CSS3新特性有哪些? 颜色:新增RGBA,HSL...

  • 初级了解css3伪类选择器

    在 CSS3 中,选择器是一种模式,用于选择需要添加样式的元素。 先来了解一下css3选择器的分类 css3选择器...

  • CSS3笔记(一)选择器

    回顾css3之前的选择器 css3选择器 1、属性选择器 2、结构 伪类选择器 注意点 : 选择是分类型,排序是不...

  • 2019前端经典面试题 CSS 部分常见问题

    CSS部分常见问题 1、CSS3选择器有哪些? 答:属性选择器、伪类选择器、伪元素选择器。 2、CSS3新特性有哪...

  • css选择器

    css1,2选择器 css3选择器

  • 移动web界面样式

    CSS3 CSS3在移动web开发中使用的特性包括:增强的选择器阴影强大的背景设置圆角边框 选择器 属性选择器完全...

  • CSS 3 选择器

    CSS3追加的选择器 在CSS3中,追加了三个属性选择器分别为 这样使得选择器有了通配符的概念。 结构性伪类选择器...

  • css3选择器

    CSS3选择器分类 层次选择器,常用的选择器| 选择器|类型|说明 ||--|--|--|--||E F |后代...

  • CSS3属性选择器

    CSS3中属性选着器增加了3个 结构性伪类选择器 CSS3结构性伪类选择器 CSS3选择器详解二 第二部分小节 、...

网友评论

      本文标题:CSS3选择器

      本文链接:https://www.haomeiwen.com/subject/pygksftx.html