Thursday, February 10, 2022

The rotate()Method

 The rotate()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 rotate()Method</h1>

    <p>The rotate()method rotate an element clockwise or counter-clockwise  </p>

    <div>This a normal element</div>

    <div id="mydiv">the div element is rotated clockwise with 20 degrees</div>

</body>


</html>


CSS rotate Style

 div{

    width:300px;

    height:100px;

    background-color: yellow;

    border:1px solid black ;

}

#mydiv{

    transform: rotate(-20deg);

}

No comments:

Post a Comment

JavaScript Animated

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