首页 前端知识 太完整了,css3新增了选择器,还有人不知道吗,毕业一年萌新的前端大厂面经

太完整了,css3新增了选择器,还有人不知道吗,毕业一年萌新的前端大厂面经

2024-04-30 11:04:50 前端知识 前端哥 812 638 我要收藏

div[class^=“icon”]{

color: blue;

}

/*4.匹配具有class属性且值以data结尾的div元素 */

div[class$=“data”]{

color:green;

}

/*5.匹配具有class属性且值包含om的div元素 */

div[class*=“om”]{

color: orange;

}

小图标1 小图标2 小图标3 小图标4 小图标5 我是阿牛 阿牛 哇 你好 好

在这里插入图片描述

结构伪类选择器


结构伪类选择器主要根据文档结构来选择元素,常用于选取父级选择器里面的了元素

| 选择符 | 简介 |

| — | — |

| E : first - child | 匹配父元素中的第一个子元素E |

| E : last - child | 匹配父元素中最后一个 E 元素 |

| E : nth - child ( n ) | 匹配父元素中的第个子元素 E |

| E : first - of - type | 指定类型 E 的第一个 |

| E : last - of - type | 指定类型 E 的最后一个 |

| E : nth - of - type ( n ) | 指定类型 E 的第 n 个 |

区别:

  • nth - child 对父元素里面所有孩子排序选择(序号是固定的)先找到第 n 个孩子,然后看是否和 E 匹配。

  • nth - of - type 对父元素里面指定子元素进行排序选择。先去匹配 E ,然后再根据E找第 n 个孩子。

注: nth - child ( n )选择某个父元素的一个或多个特定的子元素。

  • n 可以是数字,关键字和公式。

  • n 如果是数字,就是选择第 n 个子元素,里面数字从1开始…。

  • n 可以是关键字: even 偶数, odd 奇数。

  • n 可以是公式;常见的公式如下(如果 n 是公式,则从0开始计算,但是第0个元素或者超出了元素的个数会被忽略)

| 公式 | 取值 |

| — | — |

| n | 1 2 3 … |

| 2n | 偶数 |

| 2n+1 | 奇数 |

| 5n | 5 10 15… |

| n+5 | 从第5个开始(包含第五个)到最后 |

| -n+5 | 前5个(包含第5个)… |

| … | … |

示例

Document
    • 我是第1个孩子
    • 我是第2个孩子
    • 我是第3个孩子
    • 我是第4个孩子
    • 我是第5个孩子
    • 我是第6个孩子
    • 我是第7个孩子
    • 我是第8个孩子
      1. 我是第1个孩子
      2. 我是第2个孩子
      3. 我是第3个孩子
      4. 我是第4个孩子
      5. 我是第5个孩子
      6. 自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。

        深知大多数前端工程师,想要提升技能,往往是自己摸索成长或者是报班学习,但对于培训机构动则几千的学费,着实压力不小。自己不成体系的自学效果低效又漫长,而且极易碰到天花板技术停滞不前!

        因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。
        img
        img
        img
        img
        img
        img

        既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化!

        由于文件比较大,这里只是将部分目录大纲截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且后续会持续更新

        如果你觉得这些内容对你有帮助,可以添加V获取:vip1024c (备注前端)
        img

        总结

        =============================================================

        从转行到现在,差不多两年的时间,虽不能和大佬相比,但也是学了很多东西。我个人在学习的过程中,习惯简单做做笔记,方便自己复习的时候能够快速理解,现在将自己的笔记分享出来,和大家共同学习。

        个人将这段时间所学的知识,分为三个阶段:

        第一阶段:HTML&CSS&JavaScript基础

        第二阶段:移动端开发技术

        第三阶段:前端常用框架

        • 推荐学习方式:针对某个知识点,可以先简单过一下我的笔记,如果理解,那是最好,可以帮助快速解决问题;如果因为我的笔记太过简陋不理解,可以关注我以后我还会继续分享。

        • 大厂的面试难在,针对一个基础知识点,比如JS的事件循环机制,不会上来就问概念,而是换个角度,从题目入手,看你是否真正掌握。所以对于概念的理解真的很重要。

        一个人可以走的很快,但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎扫码加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
        img

        识点,可以先简单过一下我的笔记,如果理解,那是最好,可以帮助快速解决问题;如果因为我的笔记太过简陋不理解,可以关注我以后我还会继续分享。

        • 大厂的面试难在,针对一个基础知识点,比如JS的事件循环机制,不会上来就问概念,而是换个角度,从题目入手,看你是否真正掌握。所以对于概念的理解真的很重要。

        一个人可以走的很快,但一群人才能走的更远。不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎扫码加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
        [外链图片转存中…(img-zlZt7Scw-1712513837120)]

      转载请注明出处或者链接地址:https://www.qianduange.cn//article/6672.html
      标签
      评论
      发布的文章

      JQuery中的load()、$

      2024-05-10 08:05:15

      大家推荐的文章
      会员中心 联系我 留言建议 回顶部
      复制成功!