css transfomr code example
Example 1: rotate element css
div {
width: 80px;
height: 80px;
background-color: skyblue;
}
.rotated {
transform: rotate(45deg);
background-color: pink;
}
Example 2: trancate en css
<h1>
This little piggy went to market and this little piggy stayed home.
</h1>
h1 {
width: 200px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding: 20px;
font-size: 1.3rem;
margin: 0;
background: white;
resize: horizontal;
}
body {
height: 100vh;
overflow: hidden;
display: grid;
place-items: center;
background: #ccc;
}
Example 3: css transform property
Read this comprehensive article about CSS animation transform property.
It also has many useful examples that help you in best way.
https://medium.com/swlh/learn-css-transform-animation-zero-to-hero-6a2a643bd56b