1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="UTF-8">
  5. 	<title>Document</title>
  6. 	<style>
  7. 		*{
  8. 			margin:0;
  9. 			padding:0;
  10. 		}
  11.         .icon-img{
  12.         	display: block;
  13.         	margin-top: 5px;
  14.         	width: 140px;
  15.         	height: 140px;
  16.         	margin: 9px auto 0;
  17.         	position: relative;
  18.         }
  19. 		.icon-img img{
  20. 			  display:block;
  21.               position: relative;
  22.               z-index: 1;
  23.               width: 95%;
  24.               top: 50%;
  25.               left: 50%;
  26.               top: 0\9;
  27.               left: 0\9;
  28.               top: 50%\9\0;
  29.               left: 50%\9\0;
  30.               -moz-transform: translate(-50%,-50%);
  31.               -ms-transform: translate(-50%,-50%);
  32.               -o-transform: translate(-50%,-50%);
  33.               -webkit-transform: translate(-50%,-50%);
  34.               transform: translate(-50%,-50%);
  35.               -moz-transition: width .3s;
  36.               -ms-transition: width .3s;
  37.               -o-transition: width .3s;
  38.               -webkit-transition: width .3s;
  39.               transition: width .3s;
  40. 		}
  41. 		.icon-img:hover  img {
  42. 			width:105%!important
  43. 		}
  44.  
  45. 	</style>
  46. </head>
  47. <body>
  48. 	<div class="icon-img">
  49. 		<img alt="" src="http://img.alicdn.com/bao/uploaded/TB1l3QFLpXXXXaoXVXXSutbFXXX.jpg">
  50. 	</div>
  51. </body>
  52. </html>

　　

css3 scale的用法例子的更多相关文章

  1. CSS3的@keyframes用法详解:

    CSS3的@keyframes用法详解:此属性与animation属性是密切相关的,关于animation属性可以参阅CSS3的animation属性用法详解一章节. 一.基本知识:keyframes ...

  2. css基础之 font的简写规则 以及 自定义 CSS3 @font-face详细用法

    Part 1 font简写 CSS的命名规则是用英文字母 数字 和下划线(一般用小写)来命名.简写css font的好处有三:一是写起来方便(就像键盘快捷键):二是简化代码:三是帮助你熟悉和深刻理解c ...

  3. css3 calc()的用法

    转载自:css3 calc()的用法 说明:calc(四则运算):任何长度值都可以使用calc()函数进行计算:和平时的加减乘除优先顺序一样一样的: 特别注意:calc()里面的运算符必须前后都留一个 ...

  4. 前端CSS3动画animation用法

    前端CSS3动画animation用法 学习如下动画属性 @keyframes animation-name animation-duration animation-delay animation- ...

  5. include的用法例子，以及include+merge的用法例子

    [include+LinearLayout]的使用例子 AndroidIncludeLayout.java package com.AndroidIncludeLayout; import andro ...

  6. CSS3的基础用法

    CSS3的现状:1.浏览器支持程度差,需要添加私有前缀 2.移动端支持优于PC端 3.不断改进中 4.应用相对广泛 在CSS3中增加新增了许多灵活查找元素的方法,极大的提高了查找元素的效率和精准度.C ...

  7. 一个关于css3背景透明的例子

    大家都知道使用opacity调节透明度不仅是背景透明了而且选择区域的文字也跟着透明了, 这是我们不想要的效果,于是强大的css3便有了只让背景透明的功能 那就是background:rgba(0,0, ...

  8. 类似今日头条，头部tab可滑动，下面的内容可跟着滚动，掺杂着vue和require等用法例子

    1.在main.js里 /*主模块的入口 结合require一起使用*/ require.config({//require的基础用法 配置一下 paths: { "Zepto" ...

  9. CSS3的filter用法

    最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果.今天终于抽出时间学习这个CSS3的Filter.不整不知道呀,一整才让我感到吃惊,太强大了.大家先来看个效果吧: 我想光看上面的 ...

随机推荐

  1. Android里使用正則表達式

    在Android里怎样使用正則表達式: 以验证username为例.username一般字母开头,同意字母数字下划线.5-16个字节: String regEx = "^[a-zA-Z][a ...

  2. MySQL具体解释（9）----------索引具体解释

    写在前面:索引对查询的速度有着至关重要的影响,理解索引也是进行数据库性能调优的起点. 考虑例如以下情况.假设数据库中一个表有10^6条记录,DBMS的页面大小为4K.并存储100条记录.假设没有索引, ...

  3. ASIHTTPRequest 框架的导入

    刚接触ios 对一切都不熟悉  记录一下ASIHTTPRequest 框架的导入 步骤 以便日后再用 1.首先下载ASIHTTPRequest:点击下载 2.在project中导入下面文件: 导入方式 ...

  4. HDU 3016 Man Down(线段树)

    HDU 3016 Man Down 题目链接 题意:是男人就下100层的游戏的简单版,每次仅仅能从两端下落.求落地最大血量 思路:利用线段树能够处理出每一个线段能来自哪几个线段.然后就是dag最长路了 ...

  5. Android面试精华

    SIM卡的EF文件有什么作用? SIM卡里的全部文件按树来组织: 主文件MF(Master File)--主文件仅仅有文件头,里面存放着整个SIM卡的控制和管理信息 专用文件DF(Dedicated ...

  6. 《鸟哥的Linux私房菜-基础学习篇（第三版）》（三）

    第2章 Linxu怎样学习         1. Linux当前的应用角色 当前的Linux常见的应用可略分为企业应用和个人应用双方面. 首先谈了企业环境的利用. 1)网络server. 2)关键任务 ...

  7. Android Camera+SurfaceView实现自己定义拍照

    对Activity强制横屏,保证预览方向正确. 使用OrientationEventListener监听设备方向.推断竖拍时,旋转照片后再保存.保证竖拍时预览图片和保存后的图片方向一致. 执行效果: ...

  8. Java (JDK7)中的String常量和String.intern的实现

    在java中有constantPool常量池,常量池里存放的是类,方法,接口的等常量,而对于存放字符串常量通常存放的符号链接Symbol 或者真实的String的对象的引用. 我们来看一段简单的代码和 ...

  9. form表单系列中文件上传及预览

    文件上传及预览 Form提交 Ajax 上传文件 时机: 如果发送的[文件]:->iframe, jQurey(),伪Ajax 预览 import os img_path = os.path.j ...

  10. 安卓开发--HttpDemo01

    package com.cnn.httpdemo01; import android.app.Activity; import android.content.Intent; import andro ...