Wednesday, March 16, 2022

The SkewX()Method

 The SkewX()Method


 <!DOCTYPE html>

<html>


<head>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="STYLESHEET" type="text/css" href="web.css">

    <title>web design</title>

</head>


<body>

<h1>The SkewX()Metod</h1>

<p>The skewx()method skew an element along the Xaxis by the give angle</p>

<div>This a nomal  div element</div>

<div id="mydiv">The div element 20 degree along the Xaxis</div>

</body>


</html>


CSS Skew()Method Style

 div{

    width: 300px;

    height: 100px;

    background-color: yellow;

    border:1px solid black ;

}

#mydiv{

    transform: skewX(20deg);

}

No comments:

Post a Comment

JavaScript Animated

  JavaScript Animated <!DOCTYPE html> <html> <style> #myContainer {   width: 400px;   height: 400px;   position: relative;...