Define skew transforms along with x axis using CSS



You can try to run the following code to implement skew transforms along with x-axis using CSS −

Example

Live Demo

<html>    <head>       <style>          div {             width: 300px;             height: 100px;             background-color: pink;             border: 1px solid black;          }          div#skewDiv {             /* IE 9 */             -ms-transform: skewX(20deg);                        /* Safari */            - webkit-transform: skewX(20deg);                        /* Standard syntax */            transform: skewX(20deg);         }       </style>    </head>    <body>       <div>          Tutorials point.com.       </div>       <div id = "skewDiv">          Tutorials point.com       </div>    </body> </html>

Output

Updated on: 2020-06-29T11:13:05+05:30

179 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements