CSS3 -webkit-transform(元素变换)
CSS3 -webkit-transform(元素变换)
-webkit-transform:none | 类型
类型:scale:缩放,1为原始大小。scale(x)。正数放大,负数缩小。属性值为一个时,x/y轴同时缩放;属性值为两个值时,分别控制x、y轴的缩放。
rotate:水平旋转,属性值格式为Xdeg。(deg是“度”的意思)rotate(Xdeg)。X为正数时,顺时针旋转;为负数时,逆时针旋转
translate:平移,基于XY轴重新定位元素。translate(Xpx,Ypx)。属性值为一个时,x、y轴参数相同;为两个时,x、y轴分别定位
skew:将元素沿水平方向倾斜变形。skew(Xdeg,Ydeg)。这个比较难表述,想象一下平行四边形吧。属性值为一个时,x、y轴参数相同;为两个时,x、y轴各自倾斜
matrix:矩阵
示例:
.body{
margin-top: 3%;
-webkit-transform: scale(0.8,0.3); /*设置放大缩小*/
}
CSS3 -webkit-transform(元素变换)的更多相关文章
- 好吧,CSS3 3D transform变换,不过如此!
一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...
- 好吧,CSS3 3D transform变换,不过如此!——张鑫旭
一.写在前面的秋裤 早在去年的去年,我就大肆介绍了2D transform相关内容.看过海贼王的都知道,带D的家伙都不是好惹的,2D我辈尚可以应付,3D的话,呵呵,估计我等早就在千里之外被其霸气震晕了 ...
- 关于CSS3中transform变换的小坑
2017年6月30日15:05:46 今天在写一个demo的时候,发现CSS3中transform变换的一个特性. 首先,我先描述一下我发现的情况(问题再现): <div class=" ...
- 第98天:CSS3中transform变换详解
transform变换详解 本文主要介绍变形transform. Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放sc ...
- 通过js获取元素css3的transform rotate旋转角度方法
我们再试用jquery获取样式的时候是通过$('domName').css('transform'):的方式来获取元素的css样式,但是通过它获取到的css3的transform属性是以矩阵的方式呈现 ...
- css3的transform变换scale和translate等影响jQuery的position().top和offset().top
css3的transform变换scale和translate等影响jQuery的position().top和offset().top
- CSS3 2D Transform
在 一个二维或三维空间,元素可以被扭曲.移位或旋转.只不过2D变形工作在X轴和Y轴,也就是大家常说的水平轴和垂直轴:而3D变形工作在X轴和Y轴之外, 还有一个Z轴.这些3D变换不仅可以定义元素的长度和 ...
- CSS3 3D Transform
CSS3 3D Transform 原文:http://www.w3cplus.com/css3/css3-3d-transform.html 三维变换使用基于二维变换的相同属性,如果您熟悉二维变换, ...
- css3 过渡和2d变换——回顾
1.transition 语法:transition: property duration timing-function delay; transition-property 设置过渡效果的css ...
随机推荐
- 生成MySql数据库的数据字典代码参考
Code: /** * 生成mysql数据字典 */ //配置数据库 $dbserver = "127.0.0.1"; $dbusername = "root" ...
- c++实现多叉树树形显示(适合家谱的显示)
多叉树(左兄弟右孩子二叉树)的树形显示 核心代码 void positionadd(Multiway_tree*root, int n) { if (!root)return; Multiway_tr ...
- ubuntu14.10,安装ksnapshot(截图软件)
Linux:ubuntu14.10 ubuntu软件中心对它的描述:KSnapshot captures images of the screen. It can capture the whole ...
- NSSize 尺寸
前言 结构体,这个结构体用来表示事物的宽度和高度. typedef CGSize NSSize; struct CGSize { CGFloat width; CGFloat height; }; t ...
- 20165219 2017-2018-2 《Java程序设计》第7周学习总结
20165219 2017-2018-2 <Java程序设计>第7周学习总结 课本知识总结 第11章 JDBC与MySQL数据库 连接数据库 1下载JDBC-MySQL数据库驱动 2 加载 ...
- 基于CAS的单点登录实战(2)-- 搭建cas的php客户端
在这之前已经搭好了CAS服务端 基于CAS的单点登录实战(1)-- 搭建cas服务器 PHP-Client php-Client是官方支持的,去官网下个最新版就好了.phpCAS 接入很简单,解压放到 ...
- 墨菲定律与 IndexOutOfBoundsException(数组越界异常)
今天维护又反馈了一问题过来,查询试卷时报数组越界异常: 2017-02-28 10:45:24,827[ERROR] HttpException[10.32.111.7:60446:2D07867BE ...
- 用HTML,css完成的百叶窗效果,新手必看
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title> ...
- 'javac' 不是内部或外部命令,也不是可运行的程序
win10 系统下'javac' 不是内部或外部命令,也不是可运行的程序 1.在系统变量下面配置 JAVA_HOME:你自己的jdk的路径 CLASSPATH= .;%JAVA_HOME%libdt. ...
- Codeforces Round #175 (Div. 2) A~D 题解
A.Slightly Decreasing Permutations Permutation p is an ordered set of integers p1, p2, ..., pn, c ...