HTML代码:

<li>&nbsp;<span>4</span>&nbsp;<a href="#">巨型一号丝瓜水320ML</a></li>

核心CSS:

        li:hover a{
color:#E9185A;
text-decoration:underline;
}
li:hover span{
background-color:#E9185A;
}

<li> 是 <span>和 <a> 的父容器,通过

父元素:hover 子元素2    {      。。。。。    }

父元素:hover 子元素2   {      。。。。。    }

:hover 鼠标同时触发两个元素变化的更多相关文章

  1. css小记:hover 鼠标滑过让该元素的子元素或者其他元素改变样式

    <!DOCTYPE><head><meta http-equiv="Content-Type" content="text/html; ch ...

  2. label标签内含有input元素,点击事件会触发两次

    **label标签内含有input元素,点击事件会触发两次** 如果你的结构是label内写input实现点击文字时候input也有相应.并且,把事件设置在了label上,那么就会执行两次了. //h ...

  3. 在css中使用hover来控制其他元素的样式,该两个元素必须是父子元素

    .col-3:hover .check-box { display: block; } 在css中使用hover来控制其他元素的样式,该两个元素必须是父子元素!!!!

  4. 解决jQuery中dbclick事件触发两次click事件

    首先感谢这位小哥!http://qubernet.blog.163.com/blog/static/1779472842011101505853216/ 太长姿势了. 在jQuery事件绑定中,dbc ...

  5. window.event.srcElement与window.event.target 触发事件的元素 触发事件对象的获取,window.event与时间函数参数的event是同一个 事件对象

    判断事件触发的元素:     var tag = window.event.target || window.event.srcElement;    if (tag.tagName.toLowerC ...

  6. jquery触发两次onchange事件

    在项目中需要给select绑定改变事件,来触发动作,但是发现改变一次select,onchange方法执行两遍 //这是那个标签,用的是我们公司内部的selectlist <select cla ...

  7. iframe onload事件触发两次

    标准参考 关于 HTML 4.01 规范中 onload 内在事件说明:http://www.w3.org/TR/html401/interact/scripts.html#adef-onload 关 ...

  8. 解决label点击事件触发两次问题

    问题描述: 通常,为了用户体验,我们点击单选框或者复选框后面文字,即可选中当前项.代码如下: <label> <input type="radio" name=& ...

  9. Set集合对象比较两个元素的方法

    Set集合对象比较两个元素的方法并不是根据“equals()”方法的返回值来比较.而是用“hashCode()”方法来进行判断.只要两个元素的“hashCode()”方法的返回值相同,就认为两个元素相 ...

随机推荐

  1. (转) weblogic 12c忘记密码

    weblogic安装后,很久不用,忘记访问控制台的用户名或者密码,可通过以下步骤来重置用户名密码. 说明:%DOMAIN_HOME%:指WebLogic Server 域(Domain)目录 我的是: ...

  2. JSONP 跨域请求原理

    0x00 简介 由于浏览器的同源策略,我们想要从别的域获取数据变得困难,需要特殊的技术才能获取 0x01 使用 客户域:client.com 服务器(他域):server.com 如客户想访问 : h ...

  3. JS获取当前日期和时间的方法,并按照YYYY-MM-DD格式化

    Js获取当前日期时间及其它操作 var myDate = new Date(); myDate.getYear();        //获取当前年份(2位) myDate.getFullYear(); ...

  4. Window10的激活步骤

    1. 首先,我们先查看一下Win10正式专业版系统的激活状态: 点击桌面左下角的“Windows”按钮,从打开的扩展面板中依次点击“设置”-“更新和安全”,并切换到“激活”选项卡,在此就可以查看到当前 ...

  5. 微信支付之扫码支付、公众号支付、H5支付、小程序支付相关业务流程分析总结

    前言 很久以来,一直想写一篇微信支付有关的总结文档:一方面是总结自己的一些心得,另一方面也可以帮助别人,但是因种种原因未能完全理解透彻微信支付的几大支付方式,今天有幸做一些总结上的文章,也趁此机会,将 ...

  6. SpringMVC 向前台页面传值-ModelAndView

    ModelAndView 该对象中包含了一个model属性和一个view属性 model:其实是一个ModelMap类型.其实ModelMap是一个LinkedHashMap的子类 view:包含了一 ...

  7. 34.ITerm配置使用——2019年12月24日

    2019年12月23日15:17:36 ITerm使用教程 1.快键键配置 设置方法 设置方法如下: (1)选择 Preference 进入偏好设置: (2)选择 Profiles > Keys ...

  8. 阅读之spring框架

    资源表示:Resource Spring框架内部使用org.springframework.core.io.Resouce接口作为所有资源的抽象和访问接口. 它继承了 org.springframew ...

  9. scrapy中的selenium

    引入 在通过scrapy框架进行某些网站数据爬取的时候,往往会碰到页面动态数据加载的情况发生,如果直接使用scrapy对其url发请求,是绝对获取不到那部分动态加载出来的数据值.但是通过观察我们会发现 ...

  10. HDU-2389-Rain on your Parade (最大匹配,kopcroft-karp)

    链接: https://vjudge.net/problem/HDU-2389 题意: You're giving a party in the garden of your villa by the ...