hover在css中的用法

Hover伪类旨在选择鼠标所在的样式。
说白了，就是改变风格，反馈。

我上周刚刚处理过一个。
链接在悬停时经常会改变颜色。
只需添加：将鼠标悬停在语法上。

例如，如果放置 div:hover{background-color:yellow}，背景将变成黄色。

尝试在p标签中添加:hover{font-weight:bold}，字体会变得更粗。

在css中:hover与cursor配合使用

hover在css中的用法

我记得有一次在一家咖啡馆，震惊地看着菜单，用手指滑过菜名，我想，这有点像悬停。
此刻，阳光明媚，桌面上的影子和鼠标指针在页面上移动时留下的痕迹一样长。

有一天，我尝试使用悬停来向导航栏添加效果。
当鼠标悬停在“咖啡”上时，文本颜色变为深棕色，就像现磨的咖啡渣一样。
我坐在窗边编码。
窗外有一棵老树，树叶在风中摇曳。
待会儿我得去看看它是否又把叶子掉下来了。

真正有趣的是，当我使用 :hover 改变同级元素的颜色时，就像玩捉迷藏一样。
例如，当鼠标悬停在“甜食”上时，旁边的“饮料”会变成黄色，但只要我抬起鼠标，“饮料”就会像变魔术一样立即变成白色。
我盯着屏幕看了半天，突然发现这和现实生活中的很多小关系很相似。
当你看着别人的眼睛时，他们也应该看着你。

等等，还有一件事。
那天我也尝试过：将悬停与动画结合起来。
随着鼠标向上移动，文字逐渐变大，就像吹气球一样。
结果非常漂亮。
不过在调试的时候，我注意到动画持续了0.5 秒，鼠标又花了0.3 秒才完全重置，有点慢。
不知你是否经历过这种情况。