css中的伪类有哪些

css伪类:“:active”、“:any-link”、“:blank”、“:checked”、“:current”、“:first”、“:first-child”、“:future”、“:focus”、“:has()”、“:host”等。

css中的伪类有哪些

本教程操作环境:windows7系统、CSS3版、Dell G3电脑。

伪类选择器(简称:伪类)通过冒号来定义,它定义了元素的状态,如点击按下,点击完成等,通过伪类可以为元素的状态修改样式。CSS伪类是用来添加一些选择器的特殊效果。

css中的伪类列表

:active:any-link:blank:checked:current:default:defined:dir():disabled:drop:empty:enabled:first:first-child:first-of-type:fullscreen:future:focus:focus-visible:focus-within:has():host:host():host-context():hover:indeterminate:in-range:invalid:is():lang():last-child:last-of-type:left:link:local-link:not():nth-child():nth-col():nth-last-child():nth-last-col():nth-last-of-type():nth-of-type():only-child:only-of-type:optional:out-of-range:past:placeholder-shown:read-only:read-write:required:right:root:scope:target:target-within:user-invalid:valid:visited:where()

常用的伪类及其分类

立即学习“前端免费学习笔记(深入)”;

1、动态伪类选择器

不同的状态,使用不同的样式。

E:link

E:visited

E:active

E:hover

E:focus

2、目标伪类选择器

用来匹配页面的URI中某个标识符的目标元素。

E:target

选择匹配E的所有元素,且匹配元素被相关URL指向。

3、语言伪类选择器

用来匹配使用指定语言的元素。

E:lang(language)

4、元素状态伪类选择器

当元素处于某种状态下时,才起作用,在默认状态下不起作用。

E:checked

eg:

input[type="checkbox"]:checked{}

登录后复制

E:enabled

eg:

input[type="text"]:checked{}

登录后复制

E:disabled

eg:

input[type="text"]:disabled{}

登录后复制

5、结构伪类选择器

这个就比较多了,平时用的也比较频繁。

:nth-child

:nth-last-child

:nth-of-type

:nth-last-of-type

:first-child

:last-child

:only-child

:first-of-type

:last-of-type

:only-of-type

:root 匹配元素所有在文档的根元素

:empty 选择没有子元素的元素,且不包含节点

6、否定伪类选择器

E:not(F) 匹配所有除F外的E元素

(学习视频分享:css视频教程)

以上就是css中的伪类有哪些的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2947875.html

(0)
上一篇 2025年3月11日 23:02:45
下一篇 2025年2月23日 02:47:28

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • css不继承父类的属性有哪些

    css不继承父类的属性有:display、width、height、margin 、border、float、clear、position、top、right、bottom、left、background、content、size等等。 本…

    2025年3月11日
    200
  • CSS中常见的布局有哪些?

    CSS中常见的布局有:1、水平居中,内联元素水平居中、块级元素水平居中和多块级元素水平居中;2、垂直居中,单行内联元素垂直居中和多行元素垂直居中;3、利用flex布局;4、单列布局;5、两列布局。 本教程操作环境:windows7系统、CS…

    2025年3月11日
    200
  • css怎么设置div不透明

    css设置div不透明的方法:1、使用元素的opacity属性,设置遮罩层的效果;2、通过opcity等属性设置父级p透明,子p不透明。 本文操作环境:windows7系统、HTML5&&CSS3版,DELL G3电脑 cs…

    2025年3月11日 编程技术
    200
  • css怎样让图片居中

    css让图片居中的方法:1、设置“”;2、设置css代码;3、给父级元素设置样式;4、给Img设置“max-width:100% max-height:100%”即可。 css/editerView/ck_htmledit_views-b5…

    2025年3月11日 编程技术
    200
  • html怎么加载css

    html加载css的方法:1、通过外部样式加载css;2、通过内部样式加载css;3、通过行内样式加载css;4、通过导入样式加载css。 本文操作环境:windows7系统、HTML5&&CSS3版,DELL G3电脑 h…

    2025年3月11日
    200
  • css怎么隐藏div

    css隐藏div的方法:1、通过“display:none”实现隐藏div;2、通过“visibility:hidden”实现隐藏div;3、通过“opacity:0”实现隐藏div。 本文操作环境:windows7系统、HTML5&amp…

    2025年3月11日
    200
  • css怎么设置角度

    在css中可以通过rotate函数设置角度,使用语法是“rotate(a)”,其中参数a指定了rotate()的旋转程度,参数为正时,则是顺时针旋转;参数为负时,则为逆时针旋转。 本文操作环境:windows7系统、HTML5&&a…

    2025年3月11日
    200
  • css怎么设置实线

    css设置实线的方法:首先创建一个HTML示例文件;然后通过“p.solid {border-style:solid;}”样式设置实现边框即可。 本文操作环境:windows7系统、HTML5&&CSS3版,DELL G3电…

    2025年3月11日
    200
  • css换行代码是什么

    css换行代码:1、“word-wrap: break-word;word-break: normal;”语句可实现自动换行;2、“word-break:break-all;”语句可实现强制英文单词换行。 本教程操作环境:windows7系…

    2025年3月11日
    200
  • css使图片居中的方法有哪些

    CSS图片居中的方法:1、利用“text-align: center;”样式;2、利用“margin: 0 auto;”样式;3、利用弹性盒布局;4、利用栅格布局;5、利用绝对定位中对齐;6、利用background属性,实现背景图片居中。…

    2025年3月11日
    200

发表回复

登录后才能评论