CSS Pseudo-Classes Selectors

  • 伪类选择符

伪类选择符 Pseudo-Classes Selectors

Selectors
选择符
CSS Version
版本
Description
简介
link CSS1 设置超链接a在未被访问前的样式。
visited CSS1 设置超链接a在其链接地址已被访问过时的样式。
hover CSS1/2 设置元素在其鼠标悬停时的样式。
active CSS1/2 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式。
focus CSS1/2 设置元素在成为输入焦点(该元素的onfocus事件发生)时的样式。
lang(fr) CSS2 匹配使用特殊语言的E元素。
not(s) CSS3 匹配不含有s选择符的元素E。
root CSS3 匹配E元素在文档的根元素。
first-child CSS2 匹配父元素的第一个子元素E。
last-child CSS3 匹配父元素的最后一个子元素E。
only-child CSS3 匹配父元素仅有的一个子元素E。
nth-child(n) CSS3 匹配父元素的第n个子元素E。
nth-last-child(n) CSS3 匹配父元素的倒数第n个子元素E。
first-of-type CSS3 匹配同类型中的第一个同级兄弟元素E。
last-of-type CSS3 匹配同类型中的最后一个同级兄弟元素E。
only-of-type CSS3 匹配同类型中的唯一的一个同级兄弟元素E。
nth-of-type(n) CSS3 匹配同类型中的第n个同级兄弟元素E。
nth-last-of-type(n) CSS3 匹配同类型中的倒数第n个同级兄弟元素E。
empty CSS3 匹配没有任何子元素(包括text节点)的元素E。
checked CSS3 匹配用户界面上处于选中状态的元素E。(用于input type为radio与checkbox时)
enabled CSS3 匹配用户界面上处于可用状态的元素E。
disabled CSS3 匹配用户界面上处于禁用状态的元素E。
target CSS3 匹配相关URL指向的E元素。
@page:first CSS2 设置页面容器第一页使用的样式。仅用于@page规则
@page:left CSS2 设置页面容器位于装订线左边的所有页面使用的样式。仅用于@page规则
@page:right CSS2 设置页面容器位于装订线右边的所有页面使用的样式。仅用于@page规则
CSS3 Object-fit和Object-position

当然也有修复的方法,但所有人都在说:媒体调整的行为将会失控!是的,现在我们将要解决这个问题。CSS标准提出属性object-fit和object-positio...4月6日

15个无比华丽的HTML5/CSS3动画应用

未来的Web将会是由HTML5主导,当然作为开发者对这一喜讯更为动心。本文主要分享了15个无比华丽的HTML5/CSS3动画应用,供大家参考学习。1...6月6日

一个栗子上手CSS3动画

列举CSS3动画的属性,若需要了解API,可前往MDN。作者:伯乐在线来源:前端大全|2017-05-1115:20最近杂七杂八的事情很多,很多知识都没来得及总结...5月11日

200页的前端开发面试题整理版之HTML5+CSS3(四)

+CSS31.CSS3有哪些新特性?1.CSS3实现圆角(border-radius),阴影(box-shadow),2.对文字加特效(text-shadow、)...4月4日

我们来做一个beautiful的css3鼠标悬停效果

其实一个冒号跟两个冒号没有本质的区别,都是表示在什么什么之前,他这么写主要只是为了区分css2和css3,也就是ie和主流浏览器...4月23日

纯CSS3画出小黄人并实现动画效果

前两天我刚发布了一篇CSS3实现小黄人动画的博客,但是实现的CSS3动画是基于我在站酷网找到的一张小黄人的jpg格式图片,并自己用PS抠出需要实现动画的部分...5月3日

精选10款超酷的HTML5/CSS3菜单

款超酷的HTML5/CSS3菜单,给你的网页添加不一样的精彩,一起来围观一下吧。1、CSS3手风琴菜单下拉展开带弹性动画利用CSS3技术可以实现各种各样的网页菜单...5月24日

网站设计中10个经典的CSS3动效库

深圳网站设计公司科慧设计一般会在网站中加入一些简单而一致的动效,我所用的技术则是用SASS+bourbon来生成出那些基于CSS3的动画效果来...5月11日

纯CSS3做炫酷环形星星发光动画,在简单没思路你也做不出来

这个特效是用CSS3制作的,虽然录制的图片出来看起来很卡,但是实际上还是很顺畅的。想要更多的企业求职加分项目,案例,学习方法可以来一下我的前端群611256580...5月23日

从矩阵与空间操作的关系理解CSS3的transform

不得不提到CSS3的transform,也就是变换。这篇文章概括了在实现时对transform的理解与总结。注:文中的图片多数截取自视频:线性代数的本质...5月13日

移动互联网之路HTML5+CSS3+jQueryMobileAPP与移动网站设计从入门到精通PDF

移动互联网之路(附光盘HTML5+CSS3+jQueryMobileAPP与移动网站设计从入门到精通)(光盘1张)》从实际应用的角度出发,系统地介绍了HTML5...5月17日

css3实现掷骰子(无图)

下面用css3实现的掷骰子效果,骰子点数、面和转动效果都是有css,css3完成的。截图如下:Paste_Image.png1.模板如下:/*span是点数*/2...4月19日

HTML5+CSS3技术(二)CSS使用方法和选择器

css->基础知识HTML负责网页的内容,CSS负责网页的样式,可以减少网页代码量,更能提高网络访问网页的速度...5月26日

精美CSS3聊天窗口 实用的Tooltip和自定义滚动条

这次我们要分享一款基于CSS3和HTML5的自定义聊天窗口,这里要声明的是它并不能完成聊天的功能,只是提供了聊天窗口的UI,包括,聊天语句的Tooltip样式...3月10日

详解用CSS3制作圆形滚动进度条动画效果

家用CSS3制作圆形滚动进度条动画,想不会都难!那么,到底是什么东东呢?先不急,之前我分享了一个css实现进度条效果的博客《CSS实现进度条和订单进度条》,但是呢...2月9日

实现CSS3炫酷的效果可以借助哪些工具

要了解CSS3首先要了解各种浏览器对CSS3支持的情况及目前浏览器的市场占有率情况。截止2016年12月,Chrome(webkit)40.52%、IE814...3月5日

基于CSS3 column多栏布局实现水平滑页翻页交互

星期三,00:10,归类于css相关。阅读74次,今日74次byzhangxinxufromhttp://www...2月15日

CSS·导航条分享到:导航条对于每一个Web前端攻城狮来说并不陌生,但是毛玻璃可能会相对陌生一些。简单的说,毛玻璃其实就是让图片或者背景使用相应的方法进行模糊处理...2016年12月19日

CSS3参考手册,全网最新最全的CSS3参考手册,为你呈现最好的CSS3文档CSS3参考手册