当前位置: 首页 > 面试题库 >

如何申请子项:悬停但不申请父项:悬停

牟恺
2023-03-14
问题内容

使用以下html,当我将鼠标悬停在孩子身上时,我的父母得到绿色背景。我该如何阻止这种情况的发生?如果我将鼠标悬停在子元素之外,我确实希望使用绿色背景。

CSS3很好。

.parent {

  padding: 100px;

  width: 400px;

  height: 400px;

}



.parent:hover {

  background-color: green;

}



.child {

  padding: 100px;

  width: 200px;

  height: 200px;

}



.child:hover {

  background-color: blue;

}


<div class="parent">

  <div class="child">Child</div>

</div>

问题答案:

因此,这确实很丑陋,但是(确实)有效。我基本上是在创建父母的副本作为孩子的兄弟姐妹。默认情况下,parent-
overwrite是隐藏的,然后显示在child的悬停上。除非您使用+选择器而不是〜选择器,否则Chrome不会喜欢它。这不是很可扩展,但是可能有效。

正如其他人所说的那样,javascript可能是一个更好的解决方案。

 <style>

  .parent { padding: 100px; width: 400px; height:400px; position: relative; z-index: 998; }

  .parent:hover { background-color: green; }

  .child { padding: 100px; width: 200px; height:200px; position: relative; z-index: 1000; }

  .child:hover { background-color: blue; }

  .parent-overwrite { padding: inherit; width: inherit; height: inherit; position: absolute; top: 0; left: 0; z-index: 999; background-color: #FFF; display: none; }

  .child:hover ~ .parent-overwrite { display: block; }

</style>



<div class="parent">

    <div class="child">Child</div>

    <div class="parent-overwrite"></div>

</div>


 类似资料:
  • 问题内容: 我只是想知道有没有免费的短信网关用于发送短信。如果有一个,如何继续开发我的免费短信服务/软件? 请提供任何指导。 问题答案: 是的-Kannel是免费的开源SMS / WAP网关。但是您仍然需要连接到服务提供商。通过聚合器可以轻松得多-他们将提供API。 或者,只需将GSM调制解调器插入服务器即可(大多数现代电话将提供此服务) 我的免费短信服务 大多数服务提供商都会向您收取短信发送费用

  • 说明 微信申请退款订单SDK。 官方文档:https://pay.weixin.qq.com/wiki/doc/api/micropay.php?chapter=9_4 类 请求参数类 请求参数 类名:\Yurun\PaySDK\Weixin\Refund\Request 属性 名称 类型 说明 $_apiMethod string 接口名称 $transaction_id string 微信订单

  • 默认Quota 对于不同Region的服务,服务管理员会配置不同的默认Quota,一般新用户需要申请Quota才能使用服务。 查看Quota 每个Org都有固定的Quota配额,安装命令行工具后可使用下面命令查看。 cloudml quota list 提高Quota 可以通过3种方式,提交quota申请。 方法1. 生态云WEB控制台申请 登录融合云,在深度学习服务-资源配额tab,提交quo

  • 买家如何退换货? 1、功能路径 个人中心-我的订单-已发货-申请维权 2、操作流程 1、进入个人中心,找到订单 2、点击详情,进入订单详情页 3、点击申请维权,填写信息 4、提交 流程如下图: 5、买家填写相关处理方式、退款原因、退款金额、备注等信息后提交。 6、商家处理售后申请,打开后台-订单-售后服务 售后服务的列表显示项为商品信息、商品清单、订单金额、收货信息、买家、交易状态、操作。可根据下

  • 我正在尝试调用我的类来检查存储权限 但问题是,它不让我在一个类中实现它,我得到了以下错误- "类型权限的方法onRequest estPermissionsResult(int, String[], int[])必须覆盖或实现超类型方法" 类型权限的方法requestPermissions(字符串[],int)未定义 这是我的密码- }

  • 1、下载如流手机客户端,注册如流帐号 2、登录手机如流客户端 3、扫描你要加入企业的成员分享给你的企业二维码,填写申请信息,提交成功后请等待该企业的管理员审批