在鼠标经过图片时，图片被放大，而且还有个过渡的效果....

 <!DOCTYPE html>

 <html>

 <head>

     <link href="css/prodInfo.css" rel="stylesheet" type="text/css">

 </head>

 <style>

     div img{

         border:1px soild red;

         height: 218px;

         width: 222px;

         width:100%;

         transition: all 0.6s;

     }

     img :hover{

         transform: scale(1.2); /* 放大1.2倍 */

     }

 </style>

 <body>

     <div>

         <img src="img/prodInfo/lf.jpg"/>

     </div>

 </body>

 </html>

CSS3实现鼠标经过图片时图片放大的更多相关文章

  1. Lodop背景图无图片时显示放大叉号问题

    正常情况下,如果指定图片路径中,图片不存在或指定错误的路径,会因为找不到图片显示叉号,Lodop背景图如果设置了背景图宽度高度控制,显示的叉号也会被相应的放大,形成放大的模糊的图案,看起来就像是黑色边 ...

  2. wpf RenderTargetBitmap保存控件为图片时图片尺寸不对的问题

    使用RenderTargetBitmap渲染图片时,必须在需要渲染的控件外层包含一个border控件,不然渲染的图片返回就会出现问题. 如下: <Grid> <Grid.RowDef ...

  3. Android中处理大图片时图片压缩

    1.BitmapFactory.Options中的属性 在进行图片压缩时,是通过设置BitmapFactory.Options的一些值来改变图片的属性的,下面我们来看看BitmapFactory.Op ...

  4. com.nostra13.universalimageloader 加载displayImage图片时图片模糊的处理办法

    配置显示参数: DisplayImageOptions options = new DisplayImageOptions.Builder() .showImageOnLoading(defaultR ...

  5. css3实现 鼠标经过li时动态画边框(jq库导航)

    <!doctype html> <html> <head> <meta charset="utf-8" /> <meta na ...

  6. CSS3实现鼠标移动到图片上图片变大（缓慢变大，有过渡效果，放大的过程是有动画过渡的，这个过渡的时间可以自定义）

    转载自:http://blog.csdn.net/u014175572/article/details/51535768 CSS3的transform:scale()可以实现按比例放大或者缩小功能. ...

  7. CSS实现鼠标移入时图片的放大效果以及缓慢过渡

    transform:scale()可以实现按比例放大或者缩小功能. transition可以设置动画执行的时间,实现缓慢或者快速的执行动画,效果图如下: 源码: <!DOCTYPE html&g ...

  8. 使用JavaScript 中的Math对象和勾股定理公式，计算鼠标的位置与页面图片中心点的距离，根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大，距离近时图片缩小

    查看本章节 查看作业目录 需求说明: 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理.距离远时图片放大,距离近 ...

  9. CSS3实现鼠标移动到图片上图片变大

    CSS3实现鼠标移动到图片上图片变大(缓慢变大,有过渡效果,放大的过程是有动画过渡的,这个过渡的时间可以自定义 <!DOCTYPE html><html> <head&g ...

随机推荐

  1. php在类里如何调用call_user_func_array《细说php2》

  2. HTML5调用手机摄像头,仅仅支持OPPOHD浏览器

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 后缀数组 模板题 hdu1403（最长公共（连续）子串）

    好气啊,今天没有看懂后缀树和后缀自动机 只能写个后缀数组发泄一下了orz #include <cstdio> #include <cstring> *; int wa[N], ...

  4. arc068 E: Snuke Line

    首先要知道 (m/1 + m/2 + ... + m/m) 约为 mlogm 还有一个比较明显的结论,如果一个纪念品区间长度大于d,那么如果列车的停车间隔小于等于d,则这个纪念品一定能被买到 然后把区 ...

  5. [洛谷P2604][ZJOI2010]网络扩容

    题目大意:给定一张有向图,每条边都有一个容量C和一个扩容费用W.这里扩容费用是指将容量扩大1所需的费用. 求: 1.在不扩容的情况下,1到N的最大流: 2.将1到N的最大流增加K所需的最小费用. 题解 ...

  6. CF762E Radio Stations

    题目戳这里. 我还以为是KDtree呢,但是KDtree应该也可以做吧. 这是一道数据结构好题.考虑到由于\(K \le 10\),所以我们用两个大vector--\(Left,Right\),\(L ...

  7. [学习笔记]对未来做出承诺的DP小结

    这是一种DP状态设计方法. 有些题,当你必须以一个顺序往后填的话,然而后面的填法会对之前产生影响,那么,不妨在之前就对未来怎么填做出承诺. 通俗的讲,就是对未来打一个表. 然后后面填的时候,直接查表转 ...

  8. NOIP2010 引水入城 贪心+DFS

    我们先把简单的不能搞死,具题意可证:每个蓄水长的管辖区域一定是连续的.证明:既然我们已经能了那么我们就可以说如果这个区间不是连续的那我们取出这个区间中间阻隔开的那一段,那么对于这一整个区间来说水源不可 ...

  9. jQuery.getJSON跨域访问的正确使用方式（史上最傻瓜式解释）

    最近花了2天时间完整的看了一遍 jQuery 的API,其中 $.getJSON(url[, data][, callback]) 方法的跨域访问解释真心看的一头雾水,大家可以从这里感受一下: htt ...

  10. rman异机恢复，全部恢复和增量恢复

    1.首先准备工作:hostname 192.168.222.11 ol7.localdomain ol7建立相关目录:mkdir -p /u01/app/oracle/oradata/DB11G/mk ...