前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >CSS :hover 选择器

CSS :hover 选择器

作者头像
Devops海洋的渔夫
发布2019-05-31 16:34:20
9750
发布2019-05-31 16:34:20
举报
文章被收录于专栏:Devops专栏Devops专栏

仅供学习,转载请注明出处

hover的用处

:hover 选择器是用来给鼠标指针在其上浮动的链接设置样式。

下来使用hover来解决一个简答的需求。

当鼠标在超链接上,超链接背景颜色变为gold颜色

鼠标移动上去,则如下:

可以看到,当鼠标移动上去之后,背景的颜色就改变了。

那么:hover的这个特性只能给 a 标签使用吗?下面用span和div来测试一下看看。

使用span来测试能否使用 :hover 功能

使用div来测试能否使用:hover功能

好了,既然div可以,那么下面可以使用display来实现一个小功能。

div使用:hover功能实现内嵌一个div隐藏、呈现功能

使用display: none 就可以实现鼠标移动到绿色div就隐藏的效果的了。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019.01.26 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • hover的用处
  • 当鼠标在超链接上,超链接背景颜色变为gold颜色
  • 使用span来测试能否使用 :hover 功能
  • 使用div来测试能否使用:hover功能
  • div使用:hover功能实现内嵌一个div隐藏、呈现功能
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档