码迷,mamicode.com
首页 > 其他好文 > 详细

:hover

时间:2015-06-15 21:46:29      阅读:120      评论:0      收藏:0      [点我收藏+]

标签:

1、鼠标移动到div上,改变div的样式

div:hover{
    background-color:red;
}

<div>aaaaaaa</div>

2、使用hover显示隐藏的模块

<span class="order-details-text">
    <span class="order-details" >
      详细
       <span class="triangle_border_down"></span>
    </span>
    <span class="your-order">
      <ul class="your-order-list ">
         <li class="list-order-num">150150766970515</li>
          <li class="list-order-num">150150766970511</li>
          <li class="list-order-num">150150766970525</li>
       </ul>
    </span>
</span>
.order-details-text:hover .your-order-list{
    display: block;
}

注意:用hover显示隐藏的模块,该隐藏的模块必须是鼠标滑动到的模块的子模块,如要显示your-order-list,鼠标滑动到模块order-details-text,那么your-order-list必须是order-details-text的子元素

:hover

标签:

原文地址:http://www.cnblogs.com/dragonlong/p/4578939.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!