matrix() 是一个含六个值的(a,b,c,d,e,f)变换矩阵,用来指定一个2D变换,相当于直接应用一个[a b c d e f]变换矩阵。就是基于水平方向(X轴)和垂直方向(Y轴)重新定位元素,此属性值使用涉及到数学中的矩阵,我在这里只是简单的说一下CSS3中的transform有这么一个属性值,如果需要深入了解,需要对数学矩阵有一定的知识。

示例演示:通过matrix()函数来模拟transform中translate()位移的效果。
HTML代码:

<div class="wrapper">

<div></div>

</div>

CSS代码:

.wrapper {

width: 300px;

height: 200px;

border: 2px dotted red;

margin: 40px auto;

}

.wrapper div {

width:300px;

height: 200px;

background: orange;

-webkit-transform: matrix(1,0,0,1,50,50);

-moz-transform:matrix(1,0,0,1,50,50);

transform: matrix(1,0,0,1,50,50);

}

演示结果:

变形--矩阵 matrix()的更多相关文章

  1. numpy教程:矩阵matrix及其运算

    http://blog.csdn.net/pipisorry/article/details/48791403 numpy矩阵简介 NumPy函数库中存在两种不同的数据类型(矩阵matrix和数组ar ...

  2. 果皇的矩阵[matrix]

    #1101. 果皇的矩阵[matrix] 题目描述 输入格式 一行两个数,表示 N,M. 输出格式 一行一个数,表示答案对 10^9+7 取模后的结果 样例 样例输入 3 3 样例输出 38 数据范围 ...

  3. python小白之矩阵matrix笔记(updating)

    Matrix #python学习之矩阵matrix 2018.4.18 # -*- coding: UTF-8 -*- from numpy import * import numpy as np i ...

  4. 题解 矩阵 matrix

    矩阵 matrix Description 给出一个 n × m 的矩阵.请在其中选择至多 3 个互不相交的,大小恰为 k × k 的子矩阵,使得子矩阵的 权值和最大. Input 第一行三个整数 n ...

  5. 矩阵matrix

    矩阵matrix 1. 矩阵matrix 1.1. 定义由 m × n 个数aij排成的m行n列的数表称为m行n列的矩阵,简称m × n矩阵.记作: 这m×n 个数称为矩阵A的元素,简称为元,数aij ...

  6. 自定义View(11)**在onDraw中使用矩阵Matrix

    1.代码示例 1.1 效果 原图 : 其尺寸为162 x 251,示例中的红点是变形的锚点. 变形之后: 1.2 代码 package com.e.weixin.session.view; impor ...

  7. 矩阵 matrix

    传送门 注意这题时限是2s [问题描述] 有一个n × m的矩阵,你从左上角走到右下角,只能向下和向右走. 每个点上有一个重量v i,j 价值w i,j 的物品,你有一个容量为S的背包,经过一个点你可 ...

  8. R语言矩阵matrix函数

    矩阵是元素布置成二维矩形布局的R对象. 它们包含相同原子类型的元素.尽管我们可以创建只包含字符或只逻辑值的矩阵,但是它们没有多大用处.我们使用的是在数学计算中含有数字元素矩阵. 使用 matrix() ...

  9. 矩阵matrix变换的用法(css3属性transform: matrix)

    参数 2D矩阵的表示 matrix(a,b,c,d,e,f),其中6个参数在矩阵的分布: -- -- | a c e | | b d f | | 0 0 1 | -- -- 在CSS3中矩阵的原始值是 ...

随机推荐

  1. autowire异常的三个情况

    2010-3-11 16:06:00 net.sf.ehcache.config.ConfigurationFactory parseConfiguration 警告: No configuratio ...

  2. 轮询、select、 epoll

    网卡设备对应一个中断号, 当网卡收到网络端的消息的时候会向CPU发起中断请求, 然后CPU处理该请求. 通过驱动程序 进而操作系统得到通知, 系统然后通知epoll, epoll通知用户代码.  一. ...

  3. Nodejs路由之间的数据传递

    实例是模拟登录页面提交表单,然后根据信息判断是否登录成功 login.js var express =require('express'); var router =express.Router(); ...

  4. caption,为表格增加标题和摘要

    格式: <table summary="***"> <caption>***</caption> <tr> </tr> ...

  5. 删除Checkout with Multiple Addresses

    如果选择No,您的客户在结账时只可以输入一个收货地址,订单的货物都会送到这个地址.如果您选择Yes,您的客户将可以选择发货到多个地址,在购物车中的Proceed to Checkout按钮下面将会出现 ...

  6. 10 Ways to Inspire Your Team

    Inspire. Just the word itself causes us to pause and think. We may remember our own personal heroes ...

  7. 不允许修改SQLserver2008r2表中字段的属性问题

    SQLserver2008r2修改表中字段的属性时弹出 点击工具->选项,取消阻止保存要求重新创建表的更改

  8. imx6 u-boot.bin 和 u-boot.imx

    有些MFG TOOL烧录工具使用了u-boot.imx,而不是原来的u-boot.bin文件进行烧录. 这两个镜像的区别是,u-boot.bin文件编译后,会在u-boot.bin的开头添加一个大小为 ...

  9. iOS UIApplicationDelegate

    1.- (void)applicationWillResignActive:(UIApplication *)application说明:当应用程序将要入非活动状态执行,在此期间,应用程序不接收消息或 ...

  10. js的语句

    1.语句类型总结 var box = 100;//单行语句 { //用花括号包含的语句集合,叫做复合语句,单位一个 //一对花括号,表示一个复合语句,处理时,可以单做一条单行语句, //复合语句,我们 ...