悬停时隐藏 div 的子元素

2024-04-15

有没有办法让这项工作发挥作用。我想将鼠标悬停在外部div并隐藏子元素而不使用 javascript。这样的事情可能吗?

.fullwrap:nth-child(1):hover { 
    display: none; 
}

要隐藏子元素,您需要这样的结构:

#parent:hover .yourchild {
   display:none;
}

Where #parent是你的外在div并具有:hoveraction,那么你只需匹配子元素即可使其隐藏。

在这种情况下,我猜你有这样的结构:

<div class="fullwrap">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</div> 

然后要隐藏一个孩子,你可以这样做:

.fullwrap:hover :nth-child(1) { 
  display: none; 
}

检查这个演示http://jsfiddle.net/55TWN/ http://jsfiddle.net/55TWN/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

悬停时隐藏 div 的子元素 的相关文章

  • Chrome:网络元素自动移动

    我正在开发一个网络项目 在过去的两周里 我正在进行学期考试 所以我要休息一下 现在 既然他们已经结束了 我又继续我的工作了 但我发现我的一些Web 元素 如按钮 span 在 Chrome 上移动了一些像素 在 IE 和 Mozilla 上
  • Highcharts - 使用选定的饼图切片获得 3D 效果

    在 highcharts 中 我试图使当用户选择或将鼠标悬停在饼图的切片上时 该切片会产生沿 z 轴 朝向用户 上升的效果 我试图通过 css 设置阴影过滤器并使切片的边框更宽 填充颜色相同 来实现此目的 然而 我面临的问题是切片仍然可以位
  • 无限水平滚动图像循环?

    所以我试图在我的网站上创建一个无限滚动动画 但我一直在努力 原始教程在这里 使用 6 张图像 最后重复 4 张图像以实现无缝过渡 https designshack net articles css infinitephotobanner
  • jquery UI datepicker仅月份和年份的css定位问题

    我已经实施了这里讨论的解决方案 JQuery 日期时间选择器 只需选择月份和年份 https stackoverflow com questions 4079525 jquery datetime picker need to pick m
  • 在Android中将半径边框绘制到imageview或textview的一个角落

    我需要在我的应用程序中为图像视图或文本视图绘制边框 但我只需要在一个角落绘制它 就像图像一样 我做了一个形状 但我在所有 4 个边上都有边框
  • Android浏览器上的Web应用程序宽度问题

    所以到目前为止我只在 Android 浏览器上遇到过这个问题 基本上我的网站几乎一直运行良好 而且我还没有在 Dolphin Opera 或 Skyfire 上看到这个问题 但偶尔当我从手机主屏幕之一上的书签重新打开 Android 浏览器
  • 在 Chrome 中为

    我已经看到这个问题多次出现 但没有任何明确的解决方案 我正在加载一个简单的视频
  • 为什么我的 NHibernate 包集合没有动态设置子项的“父 ID”?

    我有一个新对象 其中包含一些作为 IList 属性的新对象的集合 我通过sql探查器看到正在执行两个插入查询 一个用于父级 它具有新的guid id 另一个用于子级 但是 引用父级的子级上的外键是一个空guid 这是我在父级上的映射
  • 如何使用 jQuery 单击特定链接时打开引导导航选项卡的特定选项卡?

    我是 jquery 和 bootstrap 的新手 所以请考虑我的错误 我已经创建了一个用于登录和注册的 bootstrap 模式 它包含两个导航选项卡 称为登录和注册 我有两个按钮可以弹出相同的模态窗口 但在模态窗口内显示不同的选项卡 每
  • 使用溢出支持定位粘性填充材料[重复]

    这个问题在这里已经有答案了 我在用position sticky在我的应用程序中 在使用overflow属性来显示滚动条 我已经寻找了一个确实支持这种情况的polyfill 但到目前为止没有任何运气 有谁知道这样的polyfill shim
  • 如何获得 calc() 函数的无单位结果

    我正在使用此计算来获取网页中的流体行高 line height calc 1 42em 1 55 1 42 100vw 300px 1080 300 数学是工作属性 除非我改变font size特定部分 因为line height应使用无单
  • 有没有办法改变输入类型=“日期”格式?

    默认情况下 输入type date 显示日期为YYYY MM DD 问题是 是否可以将其格式强制为 DD MM YYYY 无法更改格式 我们必须区分有线格式和浏览器的表示格式 接线格式 The HTML5日期输入规范 https www w
  • 如何在Eclipse中集成CSS预处理? [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我想在 Eclipse 中编辑 SCSS 文件 最好使用语法突出显示 scss files 我发现这些资
  • 如何删除flexbox中所有换行行的左右边距(没有nth-child或js)

    我正在寻找一种好方法来删除每行中每个第一个和最后一个项目的左右边距 而不使用 nth child 或 JavaScript 如果这是不可能的 那么我想下一个最好的方法是在主弹性盒元素上设置负左 右边距 但我不太确定使用弹性盒来做到这一点的最
  • 如何适应特定子元素的宽度?

    problem 我正在尝试创建一个技能表 我无法问下一个问题为什么 所以我创建了一个新帐户并询问 当前状态 我想将元素的宽度与 meter 也就是说 如何设定区块的标准 meter 子元素 在上面的 gif 中 img meter 我想要保
  • Firefox Placeholder Before CSS 选择器不起作用

    我使用的是最新的firefox 30 0 我正在尝试在必填字段的占位符之前插入红色字体真棒星号 我在 Chrome 中工作没问题 但我在 FF 和 上遇到问题 这是一个说明我的问题的代码笔 http codepen io anon pen
  • 有没有办法将变量从 javascript 导入到 sass 或反之亦然?

    我正在制作一个依赖于块概念的 CSS 网格系统 所以我有一个基本文件 例如 max columns 4 block width 220px block height 150px block margin 10px 它被 mixin 使用 m
  • 即使在包裹后也具有等宽的弹性项目

    是否可以制作一个像这样的纯 CSS 解决方案 物品有一些min width 它们应该动态增长以填充所有容器宽度 然后换行到新行 列表中的所有项目都应具有相同的宽度 现在看起来是这样的 这就是我希望它看起来像的样子 我已经手动管理这些底部项目
  • 将 CSS 生成的三角形拆分为 2 个水平不同的相同颜色

    正如您应该能够通过此代码看到的那样fiddle http jsfiddle net Xh36r 1 以及下面 我希望能够分割显示在第二个 div 顶部的 CSS 生成的三角形水平均等在 之间orange and green使用的颜色 现在它
  • 我可以根据同一容器中另一个元素的大小强制内联文本换行吗?

    考虑这个 jsbin http jsbin com ElIKOKe 3 edit html css output 我有这个html div class container span The lime outlined container h

随机推荐

  • 使用 Gnome 启动器的相对路径

    我们正在开发一个需要在可移动设备 例如 USB 记忆棒 上运行的应用程序 在 Linux 上 我们使用 Gnome 启动器将应用程序的快捷方式放置在设备的根目录上 但是 我们需要对可执行文件和图标使用相对路径 因为我们事先不知道设备将安装在
  • 如何检查 Stream.Null?

    我有一个 WCF 服务 它返回一个 Stream 如下所示 public Stream StreamFile string filepath try Grab the file from wherever it is Throw an ex
  • Word JS API:扩展范围

    在努力解答的同时这个问题 https stackoverflow com a 51159442 3077495我真的希望能够将范围扩展特定数量的字符 在 COM API 中我会使用Range MoveEnd 是否有我在 JS API 中没有
  • javascript node.js 在 try catch 中获取行号?

    我在 node js 脚本上使用 try catch try catch err console log err 我得到这样的输出 stack Getter Setter arguments undefined type called no
  • graphql,当有“add”和“update”突变时如何设计输入类型?

    这是我的要求 添加 突变 每个字段 或称为标量 BookInput输入类型应该有额外的类型修饰符 验证非空值 这意味着当我添加一本书时 参数必须有title and author场 比如 title angular author noval
  • Elastic Beanstalk 禁用基于 4xx 响应的健康状态更改

    我有一个在 Elastic Beanstalk 上运行的 Rest api 效果很好 应用程序方面的一切都运行良好 并且按预期工作 该应用程序是一个rest api 用于查找不同的用户 example url http service co
  • 如何仅在驱动器 C:\ 上向 Shell 菜单添加条目?

    我需要向 Windows 中的资源管理器外壳添加一个上下文菜单项 通过添加一些注册表条目 这很容易做到 HKEY CLASSES ROOT Drive shell Disk cleanup command cleanmgr exe 但我喜欢
  • 使用 .NET 进行选择性 FTP 下载

    我有一个 ftp 构建站点 新构建将在其中更新 它将在每个新构建的特定 ftp 位置创建一个名为 Build XXXXX 的新文件夹 我需要从 Build XXXXX 目录中的某个位置下载构建版本 例如 Builds Build XXXXX
  • 无法从 Git Bash 推送:找不到 UI 助手“GitHub.UI”

    全新安装后 我可以克隆存储库 进行更改并提交 但是当我尝试推送时 我收到以下警告 警告 找不到 UI 助手 GitHub UI After this the process seems to still be running but it
  • 将视频流式传输到 gstreamer rtsp 服务器

    我正在尝试构建一个基于gstreamer的rtsp视频服务器 就我而言 我需要客户端连接到服务器并开始将视频流传输到服务器 我读过一些关于这个主题的教程 尤其是这个 http www ip sense com linuxsense how
  • 如何使用 Xcode UITests 点击特定点

    我想使用 Xcode UI 测试快车道快照 https github com fastlane fastlane tree master snapshot制作 Cordova 应用程序的屏幕截图 基本上 由于我的整个应用程序只是一个 Web
  • 如何获取守护程序或服务器到 C# ASP.NET Web API 的 Azure AD OAuth2 访问令牌和刷新令牌

    我已经实现了 Azure AD OAuth2 守护程序或服务器到 ASP NET Web API 但是我只收到一个访问令牌 它是 AuthenticationResult 上的属性 请参阅下面的实现 public IHttpActionRe
  • Python - 使用日期时间将日期字符串从 YYYY-MM-DD 转换为 DD-MMM-YYYY?

    所以我读了很多关于这个的帖子 但仍然被难住了 任何帮助将不胜感激 我的数据框中有一列包含日期字符串 或者什么也不包含 字符串的格式如下 2017 10 17 i e YYYY MM DD 我想将这些转换为DD MMM YYYY 所以上面的内
  • ASP.NET Core Razor 页面 - 不绑定 POST 请求

    我的 Login cshtml cs 代码文件中有以下内容 登录 cshtml cs public class LoginModel PageModel public string ReturnUrl get set public bool
  • Inno Setup 卸载进度条更改事件

    有没有类似的事件 函数CurInstallProgressChanged对于进度条CurProgress and MaxProgressInno Setup 中卸载表单中的值 对此没有本机支持 您可以做的是设置一个计时器并观察时间的变化Un
  • 如何在参数 $_GET 中使用变量?示例:($_GET[$my_var])

    我正在开发一个WordPress插件 GET的参数根据用户的偏好通过Wordpress管理面板记录在数据库中 以下验证必须通过 GET 进行 这是函数 db url get option my get url returns the val
  • 在Python中获取浮点数的“位”? [复制]

    这个问题在这里已经有答案了 我正在寻找 Java 的 Python 等价物Float floatToBits 我找到了这个Python 获取和操作 作为整数 浮点数的位模式 https stackoverflow com questions
  • Java OpenCV - 从 knnMatch 中提取良好的匹配

    我正在尝试实现一个非常简单的程序来查找两个图像之间的相似之处 我正在使用 ORB 特征检测器和图像描述符来完成此任务 并且我正在使用以下方法识别匹配knnMatch FeatureDetector detector FeatureDetec
  • PostgreSQL 排序时除以零

    我需要在 postgres 中执行这个查询 但我无法摆脱这个错误 ERROR division by zero SQL state 22012 这是查询 select id rates sum rates count from tbl no
  • 悬停时隐藏 div 的子元素

    有没有办法让这项工作发挥作用 我想将鼠标悬停在外部div并隐藏子元素而不使用 javascript 这样的事情可能吗 fullwrap nth child 1 hover display none 要隐藏子元素 您需要这样的结构 paren