热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

CSS伪类/伪元素选择器整理

一、超链接a:link{color:red;}a:visited{color:blue;}a:hover{color:black;}a:active{color:#6600CC;}注意:设置的顺序不能变,遵循爱恨(lovehate

一、超链接

a:link{ color:red;}

a:visited{ color:blue;}

a:hover{ color:black;}

a:active{ color:#6600CC;}

注意:设置的顺序不能变,遵循爱恨(love/hate)原则。 ——此原则自己在网上看别人说的,便于记忆就写在这了

二、更多伪类

:root ------------------------------ 文档的根

:nth-child(n) --------------------- 作为其父元素的第n个孩子的一个元素

:nth-last-child(n) ---------------- 作为其父元素的第n个孩子的一个元素,从最后一个数起

:nth-of-type(n) ------------------ 作为其类型的第n个兄弟的一个元素

: nth-last-of-type(n) ----------- 作为其类型的第n个兄弟的一个元素,从最后一个数起

:first-child ---------------------- 作为其父元素的第1个孩子的一个元素

:last-child ----------------------- 作为其父元素的最后1个孩子的一个元素

:first-of-type -------------------- 作为其类型的第1个兄弟的一个元素

:last-of-type ------------------- 作为其类型的第1个兄弟的一个元素,从最后一个数起

:only-child -------------------- 作为其父元素的唯一1个孩子的一个元素

:only-of-type ------------------- 作为其类型的唯一1个兄弟的一个元素

:empty -------------------------- 没有孩子或文本的一个元素

三、一些伪元素

:first-letter 第一个字母

:after 选择元素的后面,允许在这些位置插入内容

:before 选择元素的前面,允许在这些位置插入内容


推荐阅读
  • 导航栏样式练习:项目实例解析
    本文详细介绍了如何创建一个具有动态效果的导航栏,包括HTML、CSS和JavaScript代码的实现,并附有详细的说明和效果图。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 一个登陆界面
    预览截图html部分123456789101112用户登入1314邮箱名称邮箱为空15密码密码为空16登 ... [详细]
  • 优雅实现 jQuery 折叠展开下拉菜单
    本文介绍了一种使用 jQuery 实现的优雅折叠和展开效果的下拉菜单,通过简单的 HTML 结构和 CSS 样式,结合 jQuery 脚本,可以轻松创建出美观且功能强大的下拉菜单。 ... [详细]
  • 开发笔记:精通 CSS 第 10 章 变换过渡与动画 学习笔记
    开发笔记:精通 CSS 第 10 章 变换过渡与动画 学习笔记 ... [详细]
  • 使用Bootstrap创建响应式渐变固定头部导航栏的方法
    本文详细介绍了如何利用Bootstrap框架构建一个具有渐变效果的固定顶部响应式导航栏,包括HTML结构、CSS样式以及JavaScript交互的完整实现过程。适合前端开发者和学习者参考。 ... [详细]
  • 博主从零开始学习HTML(入门基础)
    从零开始学习HTML(入门基础)互联网三大基石HTTP协议URL:统一资源定位符HTML:超文本标记语言HTML的Head标签中的常用元素<!--告知 ... [详细]
  • 深入探讨jQuery中的事件处理、动画效果及表单操作
    本文详细介绍了jQuery这一流行的JavaScript库在事件处理、动画效果实现以及表单操作方面的应用。通过具体的示例和代码片段,帮助开发者更好地理解和运用jQuery的强大功能。 ... [详细]
  • SVG 动态滤镜实现水面波动效果
    探讨如何使用SVG滤镜技术创建动态的水面波动效果,包括HTML、CSS和JavaScript代码示例。 ... [详细]
  • 欢迎学习交流!!!持续更新中…文章目录页面生成过程渲染重排与重绘的比较重排(reflow)常见引起重排的属性和方法重排影响的范围尽可能减少 ... [详细]
  • CSS 布局:液态三栏混合宽度布局
    本文介绍了如何使用 CSS 实现液态的三栏布局,其中各栏具有不同的宽度设置。通过调整容器和内容区域的属性,可以实现灵活且响应式的网页设计。 ... [详细]
  • Linux 系统启动故障排除指南:MBR 和 GRUB 问题
    本文详细介绍了 Linux 系统启动过程中常见的 MBR 扇区和 GRUB 引导程序故障及其解决方案,涵盖从备份、模拟故障到恢复的具体步骤。 ... [详细]
  • 本文介绍了如何使用jQuery根据元素的类型(如复选框)和标签名(如段落)来获取DOM对象。这有助于更高效地操作网页中的特定元素。 ... [详细]
  • 本文介绍了一款用于自动化部署 Linux 服务的 Bash 脚本。该脚本不仅涵盖了基本的文件复制和目录创建,还处理了系统服务的配置和启动,确保在多种 Linux 发行版上都能顺利运行。 ... [详细]
  • 本文详细介绍了 jQuery 中的 hover() 方法,该方法用于处理鼠标悬停事件,包括鼠标进入 (mouseenter) 和鼠标离开 (mouseleave) 两个事件。通过示例代码,展示了如何使用 hover() 方法来实现动态效果。 ... [详细]
author-avatar
大永8899_226
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有