CSS添加“点击事件”，纯css属性添加

今天来了解一下什么是css专有的“点击事件”，首先呢我们需要了解一下什么是点击事件点击事件是指当用户使用鼠标或触摸屏点击网页上的某个元素时触发的一种交互行为。通过监听并处理点击事件，我们可以实现各种各样的网页交互功能，比如：

图片放大缩小： 点击图片，实现图片的放大或缩小。

按钮点击： 触发表单提交、弹出提示框等。

链接跳转： 点击链接跳转到新的页面。

菜单展开收起： 点击菜单按钮，展开或收起菜单。

简单点来说，就是你在图片或者文字等地方进行了点击而引导出来的跳转链接，图片变化，菜单展开或收缩等等出现的情况我们称之为点击事件。

但是通常我们会使用onclick用js来处理，而今天我将用css来展示点击事件。再次之前我们需要先来了解css的一个属性：hover。

:hover 是 CSS 中的一个伪类，用于为鼠标悬停在元素上时的样式设置。它可以让你为元素在不同状态下（鼠标悬停和未悬停）定义不同的样式，从而创建出更动态和交互式的网页效果。

selector:hover {
  /* 鼠标悬停时的样式 */
  color: red;
  background-color: yellow;
}

selector: 你要应用样式的元素选择器，可以是任何有效的 CSS 选择器。hover 样式: 在花括号内定义鼠标悬停时的样式。

a:hover {
  color: blue;
  text-decoration: underline;
}

等等一系列的属性，而我们如何想要使图片或者文字，点击之后会跳转，看下面举例。

首先我们需要一个a标签用来包裹我们所需要进行跳转的东西

其次我们在使用链接样式

a:hover {
  color: blue;
  text-decoration: underline;
}

这样的话当我们点击时便会跳转链接。

这样便可以跳转到我们想要去的页面。

（如有不对请大佬及时补充）（原文来自hongyu.life）