CSS2与CSS3中常用的伪类汇总大全(css3伪类有哪些)

boyanx5个月前技术教程16

CSS2与CSS3中有非常多的伪类,可以用于实现各种强大的、酷炫的功能。有用于选择标签状态的,如:a:link a:hover input:checked input:focus等;也有用于根据结构选择标签的,如:li:first-child li:nth-child()等;甚至还有非常少用,但功能强大的,如:li:not() div:target等等。

CSS2的伪类大汇总:

E:link 动态伪类选择器,用于设置未访问的连接

E:visited 动态伪类选择器,用于设置已访问过的连接

E:hover 动态伪类选择器,用于设置鼠标移到标签上的效果

E:active 动态伪类选择器,用于设置鼠标点到连接上的效果

E:focus 焦点伪类选择器,用于设置输入框获取到焦点时的效果

E:lang(zh-cn) 语言伪类选择器,用于选择设置了对应语言的标签

E:first-child 结构伪类选择器,用于选择第一个子元素

CSS3的伪类大汇总:

E:last-child 结构伪类选择器,用于选择最后一个子元素

E:only-child 结构伪类选择器,用于选择仅有的一个子元素

E:nth-child(n) 结构伪类选择器,用于选择指定位置的某个元素

E:nth-last-child(n) 结构伪类选择器,用于选择倒数指定位置的某个元素

E:first-of-type 选择同类型中的第一个同级兄弟元素E

E:last-of-type 选择同类型中的最后一个同级兄弟元素E

E:only-of-type 选择同类型中的唯一的一个同级兄弟元素E

E:nth-of-type(n) 选择同类型中的第n个同级兄弟元素E

E:nth-last-of-type(n) 选择同类型中的倒数第n个同级兄弟元素E

E:empty 选择没有任何子元素的元素E

E:checked 用于设置单选与复选框的选中项样式

E:enabled 用于设置可用的输入框的样式

E:disabled 用于设置禁用的输入框的样式

E:target 目标伪类选择器,用于设置当前锚点匹配的目标样式

E:not(s) 否定伪类选择器,用于否定某个选择器

E:root 用于选择文档的根元素,html文档根元素永远是<html>标签

这里面有非常多平时较少用到,但是功能强大的伪类。下面以 :checked为例给大家演示一下复选框的样式重置效果。

复选框与单选框在网页中是不能被随意更改外形的,但是可以使用 :checked伪类模仿一个复选框,这样就可以设置成我们想要看到的效果,例如:

要如何实现呢?

标签: css禁止选中

相关文章

css篇一 什么是css、css的作用以及css的基本格式

一、什么是csscss的英文全称是:Cascading Style Sheets,翻译过来叫:层叠样式表。这其中有两个关键字,一个是层叠一个是样式。样式指的是给html调整样式层叠指的是可以叠加调整,...

一、什么是CSS3(一,什么是人民幸福之基?)

一、什么是CSS3如何学习SEO搜索引擎优化CSS是什么Cascading Sheet层叠级联样式表,表现,网页美化CSS发展史:CSS1.0 CSS2.0 DIV + CSS HTML和CSS结构分...

用Python做个随机点名系统,禁止逃课

今天给大家分享一个随机点名的系统并把它打包成exe,压迫感来了没有~一、实现随机点名# -*- coding: UTF-8 -*-import tkinter as tkfrom pandas imp...

CSS奇思妙想-使用background创造美妙背景(上篇)

本文将介绍一些利用 CSS 中的 background、mix-blend-mode、mask 及一些相关属性,制作一些稍微复杂、酷炫的背景。通过本文,你将会了解到 CSS background 中更...

前端入门——css伪类和伪元素(css伪类hover)

伪类(pseudo-class)用于定义元素的特殊状态,伪元素(pseudo-element)用于设置元素指定部分的样式,语法如下:伪类selector:pseudo-class { proper...

Python爬虫:用Beautifulsoup爬取html文本数据

Beautifulsoup介绍:是一个高效的网页解析库,可以从HTML或XML文件中提取数据支持不同的解析器,比如,对HTML解析,对XML解析,对HTML5解析就是一个非常强大的工具,爬虫利器一个灵...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。