<html

<head>

    <title></title>

    <style>

    .test

    {

    	margin-left:300px;

    	margin-top:200px;

    	width:300px;

    	height:300px;

    	border: dashed 2px red;

    	-ms-transform:rotate(30deg);/*旋转角度单位为deg*/

    	-ms-transform:translate(10px,20px);/*如果设置margin-left或者margin-top则translate在这基础上添加的位移*/

    	-ms-transform:skew(1deg,30deg);/*沿 X 和 Y 轴的倾斜后转换*/

    	}

    </style>

</head>

<body>

<div class="test">

</div>

</body>

</html>

css“变形”效果的更多相关文章

  1. 深入理解CSS变形transform(2d)

    × 目录 [1]变形原点 [2]变形函数 [3]多值 前面的话 CSS变形transform是一些效果的集合,主要是移动.旋转.缩放和倾斜这四种基本操作,还可以通过设置matrix矩阵来实现更复杂的效 ...

  2. 用CSS变形创建圆形导航

    http://www.w3cplus.com/css3/building-a-circular-navigation-with-css-transforms.html 本文由陈毅根据SARA SOUE ...

  3. CSS变形transform(2d)

    前面的话 CSS变形transform是一些效果的集合,主要是移动.旋转.缩放和倾斜这四种基本操作,还可以通过设置matrix矩阵来实现更复杂的效果.变形transform可以实现2D和3D两种效果. ...

  4. CSS动画效果

    CSS变形效果 Transform translate:平移 translate(x,y) translateX(x) translateY(y)相对于元素原始位置平移. scale:缩放 大于1放大 ...

  5. CSS变形动画

    CSS变形动画 前言 在开始介绍CSS变形动画之前,可以先了解一下学习了它之后能做什么,有什么用,这样你看这篇文章可能会有一些动力. 学习了CSS变形动画后,你可以为你的页面做出很多炫酷的效果,如一个 ...

  6. 15个来自 CodePen 的酷炫 CSS 动画效果【下篇】

    CodePen 是一个在线的前端代码编辑和展示网站,能够编写代码并即时预览效果.你在上面可以在线分享自己的 Web 作品,也可以欣赏到世界各地的优秀开发者在网页中实现的各种令人惊奇的效果. 今天这篇文 ...

  7. 赞！15个来自 CodePen 的酷炫 CSS 动画效果

    CodePen 是一个在线的前端代码编辑和展示网站,能够编写代码并即时预览效果.你在上面可以在线分享自己的 Web 作品,也可以欣赏到世界各地的优秀开发者在网页中实现的各种令人惊奇的效果. 今天这篇文 ...

  8. CSS Shake – 摇摆摇摆！动感的 CSS 抖动效果

    CSS Shake 是一套 CSS3 动画特效,让页面的 DOM 元素实现各种效果的抖动(Shake),这些效果可以轻松的被应用到按钮.LOGO 以及图片等元素.所有这些效果都是只需要单一的标签,加上 ...

  9. Simptip – 使用 Sass 制作的 CSS Tooltip 效果

    Simptip 是一个简单基于 Sass 的 CSS 工具提示效果.帮助你在网站中加入在不同的方向(上.左.右.下)的工具提示,也可以设置不同的颜色如成功.信息.警告和危险.最后还有其他特性如软边.半 ...

随机推荐

  1. ural 1306. Sequence Median

    1306. Sequence Median Time limit: 1.0 secondMemory limit: 1 MBLanguage limit: C, C++, Pascal Given a ...

  2. 整除的尾数[HDU2099]

    整除的尾数 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  3. BZOJ3994: [SDOI2015]约数个数和

    Description  设d(x)为x的约数个数,给定N.M,求     Input 输入文件包含多组测试数据. 第一行,一个整数T,表示测试数据的组数. 接下来的T行,每行两个整数N.M.   O ...

  4. Camera Calibration and 3D Reconstruction

    3D RECONSTRUCTION WITH OPENCV AND POINT CLOUD LIBRARY http://stackoverflow.com/questions/19205557/op ...

  5. thinkphp框架中处理标签中条件输出

    这个问题是这样的,当我在模板中想在标签option中在某个条件下输出selected.但是在里边嵌套if标签的话,condition里边第二个参数使用变量的时候,不能解析.所以只能使用别的方法了.达到 ...

  6. Linux kernel perf_swevent_init Local root Exploit

    64位上编译 另外修改了原Exploit的一个错误 第76行 把     uint64_t *p = (void *) ¤t[i]; 改成       uint64_t *p = (void *) & ...

  7. Spring对加载的bean之间循环依赖的处理

    根据下面文档的叙述,简言之: 对于相互之间通过构造函数注入相互循环依赖的情况,Spring会抛出BeanCurrentlyInCreationException错误. 如果AB两个beans是通过属性 ...

  8. dig理解dns主备 - 阿权的书房

    dns的解析一般都授权两个以上,防止单点故障. 比如阿权的书房的域名 www.aslibra.com,授权两台ns.aslibra.com 和 ns2.aslibra.com,如果单点故障会怎么样呢? ...

  9. Scrum会议9(Beta版本)

    组名:天天向上 组长:王森 组员:张政.张金生.林莉.胡丽娜 代码地址:HTTPS:https://git.coding.net/jx8zjs/llk.git SSH:git@git.coding.n ...

  10. EasyUI datagrid 在ie8和360兼容模式兼容性问题

    问题:easyui中的datagrid在ie8和360兼容模式下显示不出来. 答案:不是easyui的问题.是引入的jquery版本问题.jquery-1.5.1抛异常,这个版本是mvc3自带的jqu ...