CSS 选择器大全伪类选择器大全

CSS+CSS3 选择器

类选择器： .name{}
ID选择器： #id{}
元素选择器： div{}
通配符选择器： *{}
后代选择器： div p{}
子选择器： div>p{} 和后代不一样的是，只筛选div下所有第一层p标签
兄弟选择器： div+p{} 筛选div后面一个p元素
交集选择器: div,p,.name{} 选择的元素共享一个样式
属性选择器
- 属性选择器： a[target=_blank] 筛选所有a标签中属性target是_blank的
- 属性包含选择器： div[title~=name] 筛选div属性title中包裹带有name的
- 属性开头选择器： img[src^=‘https’] 筛选img属性src以htttps开头的所有img标签
- 属性结尾选择器： img[src$=’.png’] 筛选img属性src以 .png 结尾的img标签
伪类选择器
- 焦点伪类： :focus
- 悬浮伪类： :hover
- 前置伪类：p ::after 往p元素前面追加内容
- 后置伪类：p ::before 往p元素后面追加内容
- 光棍伪类：p :empty 选择没有子元素的p标签
- 取反伪类：div: not(p) 选择div下所有不是p标签的元素
- 首个选择器： div p:first-of-type 或:first-child 选择div下面第一个p标签
- 末尾选择器： ul li:last-child 或 last-of-type 选择ul下最后一个li
- 正序筛选伪类： :nth-child(2) 正序第一个开始自由筛选第几个元素
- 倒序筛选伪类： :nth-last-child(2) 倒序最末尾开始自由筛选第几个元素
- 注意点 nth-child(2) 和 nth-of-type(2) 区别：
  - p:nth-child(2) 找位置是2的p元素，如果位置2不是p元素不生效
  - p:nth-of-type(2) 找下面p元素中排在第二的，及时前面有很多其他元素，类似兄弟选择

CSS 选择器大全伪类选择器大全相关推荐

CSS复合选择器（后代选择器、子元素选择器、并集选择器、伪类选择器、:focus伪类选择器）
复合选择器是由两个或多个基础选择器,通过不同的方式组合而成的. 1. 后代选择器后代选择器又称为包含选择器作用:用来选择元素或元素组的子孙后代其写法就是把外层标签写在前面,内层标签写在后面,中间 ...
CSS之关系选择器、属性选择器、伪类选择器
一.关系选择器后代选择器:只要是这个元素的后代,样式都会发生变化,div下面的所有h1标签样式都会改变关系选择器:子代选择器,只改变子标签的样式 <!DOCTYPE html> < ...
CSS :before :after 伪类选择器
CSS :before :after 伪类选择器所有主流浏览器都支持 :after 选择器. 注释:对于 IE8 及更早版本中的 :after,必须声明 <!DOCTYPE>. :bef ...
复合选择器-链接伪类选择器（HTML、CSS）
复合选择器-链接伪类选择器(HTML.CSS) <!DOCTYPE html> <html lang="en"><head><meta c ...
CSS复合选择器---后代选择器、子选择器、并集选择器、伪类选择器
CSS复合选择器建立在基础选择器上,对基本选择器进行组合形成的可以更准确.更高效的选择目标元素(标签) 包含:后代选择器.子选择器.并集选择器.伪类选择器一.后代选择器又称为包含选择器,可以选 ...
css中什么是伪类选择器？伪类选择器的简要介绍
本章给大家带来css中什么是伪类选择器?伪类选择器的简要介绍.让大家可以了解在css中伪类选择器的作用,css伪类选择器有哪些分类等知识.有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. ...
【CSS 教程系列第 12 篇】什么是 CSS 中的伪类选择器
这是[CSS 教程系列第 12 篇],如果觉得有用的话,欢迎关注专栏. CSS 的选择器有很多,常用的有元素选择器.id 选择器.class 选择器.后代选择器.子代选择器.并集选择器.交集选择器. ...
前端 CSS：锚伪类选择器:hover,:active，:visited；等用法总结
前端 CSS:锚伪类选择器:hover,:active,:visited;等用法总结锚伪类选择器:hover,:active,:visited;等用法总结一.什么是锚伪类在支持 CSS 的浏览器 ...
【第四篇】CSS选择器之伪类选择器
利用组合选择器虽然可以选择子类和兄弟元素,但是无法做到特殊的选择.例如无法选择第几个子类,或者和其同标签的兄弟元素.为此CSS诞生了伪类选择器,用来进行更加灵活的元素选择. 伪类选择器伪类选择器根据 ...
css选择器类型伪类选择器(详)
css选择器有八种: 1.标签选择器(如:body,div,p,ul,li). 2..类选择器(如:class="head",class="head_logo" ...

CSS 选择器大全伪类选择器大全

CSS+CSS3 选择器

CSS 选择器大全伪类选择器大全相关推荐

最新文章

热门文章

CSS 选择器大全 伪类选择器大全

CSS+CSS3 选择器

CSS 选择器大全 伪类选择器大全相关推荐

最新文章

热门文章

CSS 选择器大全伪类选择器大全

CSS 选择器大全伪类选择器大全相关推荐