transforms-skewX-ref.html (986B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Transforms Test: transform property with skew function for X axis.</title> 5 <link rel="author" title="Jacy-Bai" href="mailto:jinxin.bai@gmail.com"> 6 <link rel="reviewer" title="Dayang Shen" href="mailto:shendayang@baidu.com"> <!-- 2013-09-03 --> 7 <style type="text/css"> 8 .triangle-topright { 9 position: absolute; 10 width: 0; 11 height: 0; 12 top: 50px; 13 left: 50px; 14 border-top: 100px solid green; 15 border-left: 100px solid transparent; 16 } 17 18 .triangle-bottomleft { 19 position: absolute; 20 width: 0; 21 height: 0; 22 top: 50px; 23 left: 150px; 24 border-bottom: 100px solid green; 25 border-right: 100px solid transparent; 26 } 27 </style> 28 </head> 29 <body> 30 <p>The test passes if there is a parallelogram and no red.</p> 31 <div class="triangle-topright"></div> 32 <div class="triangle-bottomleft"></div> 33 </body> 34 </html>