PageRenderTime 22ms CodeModel.GetById 16ms app.highlight 4ms RepoModel.GetById 1ms app.codeStats 0ms

/AppLanding/js/vendor/lesshat/mixins/transform/transform.md

https://gitlab.com/webocalypse/themes
Markdown | 38 lines | 25 code | 13 blank | 0 comment | 0 complexity | a3fe3ffcd9e4a43e3ce50d7fbb173769 MD5 | raw file
 1### <a name="transform"></a> &#8226; transform
 2**Summary:**
 3
 4The CSS transform property lets you modify the coordinate space of the CSS visual formatting model. 
 5
 6Resources: **[WebPlatform](http://docs.webplatform.org/wiki/css/properties/transform)**, **[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transform)**
 7
 8**Syntax:**
 9  
10  Default value: none
11
12    .transform(none | <transform-function>+) 
13
14**Tips and tricks:**
15
16  If you omit units, `transform` can adds correct unit automatically.
17
18     translate: 'px',
19     rotate: 'deg',
20     rotate3d: 'deg',
21     skew: 'deg'
22  
23**Example:**
24
25    div {
26     .transform(scale(.5) translate(10, 20));
27    }
28    
29    // Result
30    div {
31     -webkit-transform: scale(.5) translate(10, 20);
32     -moz-transform: scale(.5) translate(10, 20);
33     -opera-transform: scale(.5) translate(10, 20);
34     -ms-transform: scale(.5) translate(10, 20);
35     transform: scale(.5) translate(10, 20);
36    }
37
38