首页 > 其他分享 >css伪类选择器大全

css伪类选择器大全

时间:2023-08-01 23:12:02浏览次数:311  
标签:伪类 元素 选中 type 选择器 css

伪类选择器

css伪类选择器大全:

https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-classes

伪类 含义
:link 选中未访问过的超链接
:visited 选中已访问过的超链接
:hover 选中鼠标移入的元素
:active 选中鼠标按下的元素
:focus 选中聚焦的表单元素
:disabled 选中被禁用的表单元素
:checked 选中被选中的表单元素
:first-child 选中第一个子元素
:last-child 选中最后一个子元素
:nth-child(an+b) 选中第「an+b」个子元素
a和b是常量,n的值会从0开始依次递增
:first-of-type 选中第一个指定类型的子元素
:last-of-type 选中最后一个指定类型的子元素
:nth-of-type(an+b) 选中第「an+b」个指定类型的子元素
a和b是常量,n的值会从0开始依次递增

标签:伪类,元素,选中,type,选择器,css
From: https://www.cnblogs.com/bingquan1/p/17599376.html

相关文章

  • a标签伪类设置后不生效
    a标签伪类设置后不生效检查书写伪类顺序是否正确link->visited->hover->activea{/*未访问过*/&:link{color:green;}/*访问过*/&:visited{color:red;}/*移入超链接*/&:hover{color:#abcdef;}/*按下超链接......
  • CSS中 no-repeat作用
    针对背景图。当你设置了no-repeat,背景图将不会被重复,不会出现平铺或重复的现象。还可以修改图片的位置,例如:{backgroud:top,center,no-repeat;}背景图位于上部的居中位置。如:.sortedDESC{      background:url(/img/icon-table-sort-desc.png)no-repeat80%11p......
  • css transform 作用
    用于元素的2D或3D转换。这个属性允许你将元素旋转【rotate】,缩放【scale】,移动【translate】,倾斜【skew】等如:旋转transform兼容浏览器需要添加前缀{ transform:translate(10,10)//W3c标准 -webkit-transform:translate(10,10)//SafariChrome -moz-transform:translate(10,......
  • css的inline-block布局方式对齐问题 —— 转载自 article/2023/7/31 16:26:21
    css的inline-block布局方式对齐问题今天在实现百度前端技术学院的如下案例时遇到了div上下对齐问题。针对如下左右两栏布局,本来使用将两栏各自div的display设置为inline-block方式来实现,为了左边高度与右边对齐,直接量出右边div按照像素高度赋给左边。但是左边元素竟然出现在了......
  • 视频直播网站源码,前端效果-css+javascript
    视频直播网站源码,前端效果-css+javascript <!DOCTYPEhtml><html><head>  <metacharset="UTF-8">  <metahttp-equiv="X-UA-Compatible"content="IE=edge">  <metaname="viewport"content="w......
  • css修改滚动条的样式
    滚动条样式的修改是通过伪元素实现的:-webkit-scrollbar​滚动条整体部分​-webkit-scrollbar-button​滚动条两端的按钮​-webkit-scrollbar-track​外层轨道​-webkit-scrollbar-track-piece​内层轨道,滚动条中间部分(除去)​-webkit-scrollbar-thumb​内嵌滑块​-webk......
  • CSS 文字-背景图片纹理、背景视频效果
    1、背景图片纹理效果实现方案:搬运CSS代码:.pattern-overlay{font-size:60px;font-family:'microsoftyahei';background-image:url(./pattern01.jpg);-webkit-text-fill-color:transparent;-webkit-background-clip:text;}.pattern-overlay......
  • CSS3
    1、什么是CSS如何学习CSS是什么CSS怎么用CSS选择器(重点+难点)美化网页(文字,阴影,超链接,列表,渐变.....)盒子模型浮动定位网页动画(特效)1.1、什么是CSSCascadingStyleSheet层叠级联样式表CSS:表现(美化网页)字体、颜色、边距、高度、宽度、背景图片、网页定位、网页浮动.........
  • python网站创建007:常见CSS样式
    1.高度和宽度注意1:默认情况下高度和宽度无法应用在行内标签上注意2:默认情况下,块级标签虽然设置了宽度,但是右边空白区域是不允许占用的 高度<divstyle="height:100px"></div>宽度<divstyle="width:200px"></div>块级标签转换为行内标签<divstyle="display:in......
  • CSS常见布局
    两栏布局1.左边固定,右边自适应布局三栏布局流体布局(浮动)BFC三栏布局双飞翼布局圣杯布局flextable布局绝对定位布局网格布局(Grid布局)......