当前位置: 首页 > article >正文

【CSS】伪类和伪元素

伪类

  1. :hover:悬停
  2. active:激活
  3. focus:获取焦点
  4. :link:未访问(链接)
  5. :checked:勾选(表单)
  6. first-child:第一个子元素
  7. nth-child():指定索引的子元素(even偶odd奇)

在这里插入图片描述

伪元素

  1. ::before:创建虚拟元素(前)
  2. ::after:创建虚拟元素(后)
  3. ::selection:选中文本
li:hover:last-child {
    cursor: pointer;
    color: royalblue;
}

li:hover:last-child::after {
    content: '我出来啦~';
    margin-left: 20px;
}

在这里插入图片描述

伪元素不支持链式写法:li::before::after{}0

动态伪类要按照lvha的顺序去写,否则因为优先级问题会出错。

动态伪类 :link不显示的原因:原因就是你已经打开你的网页,点击你的链接(打开过一次了),之后就是再怎么刷新,甚至关掉软件都是行不通的,只有修改一下链接地址才可以。


http://www.kler.cn/a/108971.html

相关文章:

  • 【MySQL】数据库知识突破:数据类型全解析与详解
  • 软考:去中心化的部署有什么特点
  • 【RabbitMQ】08-延迟消息
  • 现代Web开发:Vue 3 组件化开发实战
  • vue+Leaflet.PM插件实现创建和编辑几何图形(点、线、面、圆等)
  • 前端代码分析题(选择题、分析题)——this指向、原型链分析
  • C#WPFPrism框架导航应用实例
  • sprinbboot 2.7启动不生成日志文件
  • 电子电器架构 —— 车载网关初入门(二)
  • 【C++代码】爬楼梯,不同路径,整数拆分,不同搜索树,动态规划--代码随想录
  • 泰州市旅游景点门票预订管理系统 vue+uniapp微信小程序
  • C#:枚举是命名的整形常量的集合
  • 什么是 Node.js
  • ESM蛋白质语言模型系列
  • 202310-MetaPhlAn4安装和使用方法-Anaconda3- centos9 stream
  • Anaconda下载和安装
  • hdlbits系列verilog解答(8位宽移位寄存器)-24
  • LangChain+LLM实战---BERT主要的创新之处和注意力机制中的QKV
  • MyBatis-Plus 实战教程四 idea插件
  • IP地址与代理ip在网络安全中的关键作用
  • 震惊!图文并茂——Java后端如何响应不同格式的数据给前端(带源码)
  • 信息系统项目管理师教程 第四版【第5章-信息系统工程-思维导图】
  • 简单而高效:使用PHP爬虫从网易音乐获取音频的方法
  • 在Go中处理时间数据
  • C++STL----list的模拟实现
  • React Hooks还有哪些常用的用法?