定义元素的旋转(rotate),缩放(scale),移动(translate),倾斜(skew)

rotate

rotate(angle) 定义 2D 旋转,在参数中规定角度。
rotate3d(x,y,z,angle) 定义 3D 旋转。
rotateX(angle) 定义沿着 X 轴的 3D 旋转。
rotateY(angle) 定义沿着 Y 轴的 3D 旋转。
rotateZ(angle) 定义沿着 Z 轴的 3D 旋转。

scale

scale(x[,y]?) 定义 2D 缩放转换。
scale3d(x,y,z) 定义 3D 缩放转换。
scaleX(x) 沿X轴(水平)方向缩放y倍
scaleY(y) 沿Y轴(垂直)方向缩放y倍
scaleZ(z) 通过设置 Z 轴的值来定义 3D 缩放转换。

translate

translate(x,y) 定义 2D 转换。
translate3d(x,y,z) 定义 3D 转换。
translateX(x) 沿X轴方向移动,
translateY(y) 沿Y轴方向移动,
translateZ(z) 定义 3D 转换,只是用 Z 轴的值。

css之transform属性的更多相关文章

  1. 谈谈关于CSS中transform属性之scale

    谈谈关于scale属性 scale是什么? 根据W3C定义 ,scale主要是进行缩放和转化: scale能做什么? 1.1px细线 <div class="wrap"> ...

  2. CSS基础 transform属性的基本使用 移动 旋转 缩放

    1.实现元素位移效果 语法:transform:translate(x轴水平移动距离,Y轴垂直移动距离) 取值:正负都可以 取值方式:数字+px 百分比 :参照自己本的盒子的百分比 比如:本身自己的宽 ...

  3. css的transform属性让子元素在父元素里面垂直水平居中

  4. 理解SVG坐标系统和变换: transform属性

    SVG元素可以通过缩放,移动,倾斜和旋转来变换-类似HTML元素使用CSS transform来变换.然而,当涉及到坐标系时这些变换所产生的影响必然有一定差别.在这篇文章中我们讨论SVG的transf ...

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

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

  6. css010 css的transform transition和animation

    css010 css的transform transition和animation 看着没有一个能想起他们是干什么的.. 1.         Transform    Transform(变形) r ...

  7. CSS Counters 计数属性

    CSS Counters其实就是一计数器,早期在CSS中计数器仅存在于ul和ol元素.如果要使用在div这样的元素上,只能通过list-style-image或者是元素的backgroud-image ...

  8. CSS的常用属性

    刚开始学习前段的我,还处于初级阶段,一些东西还是会有搞不明白的时候,还是要大家多多理解.今说就一些关于CSS的常用属性吧! 一.CSS常用选择器 CSS选择器应该说是一个非常重要的工具吧,选择器用得好 ...

  9. CSS position(定位)属性

    关于CSS position,来自MDN的描述: CSS position属性用于指定一个元素在文档中的定位方式.top.right.bottom.left 属性则决定了该元素的最终位置. 然后来看看 ...

随机推荐

  1. SpringBoot 使用Hikaricp连接池

    1.添加pom.xml依赖 如果是SpringBoot2.0,那么默认的连接池就是Hikaricp,不需要配置 其他的,如果继承 <parent> <groupId>org.s ...

  2. POJ 2594 Treasure Exploration(最小可相交路径覆盖)题解

    题意:有n个点,m条单向边,每个机器人能沿着单向边走,能重复经过一个点,问最少几个机器人走遍n个点 思路:原来以前学的都是不能相交的算法....可相交的做法是跑Floyd把能到达的都加上边,然后跑最小 ...

  3. CodeChef - MRO Method Resolution Order(打表)

    题意:有一种关系叫继承,那么继承父类的同时也会继承他的一个函数f,能继承任意多个父类或不继承,但不能继承自己的子类.现在规定一个列表,这个列表必须以1~N的顺序排列,并且父类不会排在子类后面,1含有一 ...

  4. 【第四十章】Spring Boot 自定义拦截器

    1.首先编写拦截器代码 package com.sarnath.interceptor; import javax.servlet.http.HttpServletRequest; import ja ...

  5. Android 设置app 启动

    首先建立一个Activity 类.然后他会自动生成一个Layout XML. 再去到AndroidManifest.xml <activity android:name="com.zx ...

  6. tomcat使用spring-loaded实现应用热部署

    springloaded官方说明: Spring Loaded is a JVM agent for reloading class file changes whilst a JVM is runn ...

  7. Kubernetes之Controllers三

    StatefulSets StatefulSet is the workload API object used to manage stateful applications. Note: Stat ...

  8. std::cout << char + int

    #include<iostream> int main(){ char ch; std::cout << "Type, and I shall repeat.\n&q ...

  9. ADO.NET DBHelper

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Da ...

  10. Python安装第三方库的安装技巧

    电脑:Windows10 64位. Python IDE 软件:JetBrains PyCharm Community Edition 2018.1.3 x64 Python version : Py ...