在线客服
扫描二维码
下载博学谷APP扫描二维码
关注博学谷微信公众号
我们每个人都意识到了CSS的重要性,但是还有很多人不知道css有哪些基本选择器和高级选择器?下面我们来总结一下。
ID选择器>类选择器>标签选择器
行内样式>内部样式>外部样式
*结构伪类选择器 一旦设置 不管在行内还是在后面重新设置,都没办法改变
*结构伪类选择器设置奇偶行以及从第三行开始变色如何实现
nth-cild(2N+3)表示从第三行开始的奇数行
同理 nth-child(2N+4)表示从第四行开始的偶数行
nth-cild(2N+5)表示从第五行开始的奇数行
*设置前三个:
p:nth-child(-n+3){
background-color: #b3d4fc;
}
*使用E F:nth-child(n)和E F:nth-of-type(n)的 关键点
E F:nth-child(n)在父级里从一个元素开始查找,不分类型
E F:nth-of-type(n)在父级里先看类型,再看位置
注意
child 跟子选择器没有关系,可以是子选择,也可以是后代选择 由层次选择器 (如table tr)来控制
1.层次选择器
table td 后代选择器 td包含在table里
div>p子选择器 p是div的子元素
p1+p p1后面一个兄弟p变化 是对p进行处理 p1不变 而且只是下面相邻的变化 上面相邻不变化
p1~p p1后面所有兄弟p变化 p1不变
2.结构伪类选择器
P:first-child 作为父元素的第一个子元素得元素 p
P:last-child 作为父元素的最后一个子元素得元素 p
P a :nth-child(n) p中第n个a元素 (even)(odd)
p:first-of-type 必须是p元素 不是子元素也行
p a:nth-of-type(n)
必须是a元素 不是a的子元素也行
3.属性选择器
a[id] a标签中含有id的
a[id=111] a标签中的id=111的
a[href*=http] a标签中包含href属性 且都包含http
a[href&=png] a标签中包含href属性 且最后以png结尾
a[href^=http://] a标签中包含href属性且以http://开头
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
前端HTML面试题汇总附参考答案
前端的核心技术就是有结构、表现和行为三部分构成的,模式是HTML、CSS和JavaScript。HTML又叫超文本标记语言,HTML语言可以制作网页。对于前端面试者来说,HTML是几乎一项必考的知识点。因此小编汇总了前端的HTML面试题,希望能帮助求职者牢牢掌握这方面的知识点。
4704
2019-09-23 22:04:57
前端有关node.js的面试题含答案
node.js是一个平台,它是基于Chrome JavaScript运行时建立的。同时,node.js也常常被看做是运行在服务端的 JavaScript。对于前端程序员来说,即使不懂得动态编程语言,想要创建自己的服务,只要选择Node.js就好了。因此在前端面试中,有关node.js的面试题是需要重点复习的内容。下面是小编整理的有关node.js的面试题和答案,一起来看看吧!
9403
2019-10-31 10:42:10
前端面试常见知识点总结
随着疫情的逐渐好转,许多小伙伴也早已复工多时,面试招聘的机会也多了起来,大家都做好了面试准备吗?本文将为大家总结一下前端面试中常见的知识点,包括前端基础、布局、JS高级、浏览器、网络协议、ES6语法、VUE基础和VUE高级等等,有需要的小伙伴可以接着看下去。
4537
2020-04-07 16:53:39
JavaScript常见面试题梳理
JavaScript作为前端开发三大要素之一,是前端面试中考察的一大重点。本文为大家对JavaScript常见面试题进行了梳理,大家可以做一做下面的面试题,进行查漏补缺!
4575
2020-07-06 14:41:17
初中级前端程序员面试中小型公司会问哪些问题?
初中级前端程序员面试中小型公司会问哪些问题?不同的公司面试内容也不尽相同,有的面试过程很轻松,有的面试官是个架构师level 挺高不会问八股文,给出了几个现实中的场景,然后转换成代码的逻辑去让实现。
2531
2022-05-10 15:28:04