zoukankan      html  css  js  c++  java
  • 鼠标指到图片上会向上移动

    css样式:

    .anlibox{ 1170px;position:relative; left:1.5%; top: 15%; margin:0 auto;}
    .anli1{270px;}
    .anli2{278px;}
    .anli3{322px;}
    .anli4{299px;}
    .anli1 img, .anli2 img, .anli3 img, .anli4 img{transition: transform 0.5s; -webkit-transition: -webkit-transform 0.5s; /* Safari */ }
    .anli1 img:hover, .anli2 img:hover, .anli3 img:hover, .anli4 img:hover{transform: translate(0px,-10px); -ms-transform: translate(0px,-10px); /* IE 9 */ -webkit-transform: translate(0px,-10px); /* Safari and Chrome */ }

    html代码:

    <ul class="oh pt10 pb50">
    <li class="fl anli1"> <a rel="nofollow" href="photo.html"><img src="images/sj1.jpg" alt=""></a> <a rel="nofollow" href="photo.html"><img src="images/sj5.jpg" alt=""></a></li>
    <li class="fl anli2"> <a rel="nofollow" href="photo.html"><img src="images/sj2.jpg" alt=""></a> <a rel="nofollow" href="photo.html"><img src="images/sj6.jpg" alt=""></a></li>
    <li class="fl anli3"> <a rel="nofollow" href="photo.html"><img src="images/sj3.jpg" alt=""></a> <a rel="nofollow" href="photo.html"><img src="images/sj7.jpg" alt=""></a></li>
    <li class="fl anli4"> <a rel="nofollow" href="photo.html"><img src="images/sj4.jpg" alt=""></a> <a rel="nofollow" href="photo.html"><img src="images/sj8.jpg" alt=""></a></li>
    </ul>

  • 相关阅读:
    计蒜客 动态规划基础 蒜头跳木桩
    委托的使用和合并
    asp.net "callback" 和 "postback" 的区别.
    3 顶层父类
    2 异常类
    1 智能指针
    16 #error 和 #line
    15 条件编译
    14 宏
    13 编译和链接
  • 原文地址:https://www.cnblogs.com/good2008/p/7417206.html
Copyright © 2011-2022 走看看