In this blog, I am creating different transitions in buttons & div using HTML & CSS. So, Let’s create an index.html & style.css below-

In, this index.html multiple div, tag with multiple class which is defined below style.css-

In, this style.css I am used multiple classes with multiple functionalities as color, padding, margin, opacity, width & height. When you using this index.html & style.css then shows below image-

Below is one more index.html for transitions hover property-

Below is style.css for the used upper index.html –

button { height: 90px; width: 290px; font-size: 28px; color: white; border: none; background-color: blue; transition: all 3s ease-in 2s } button:hover { background-color: green; color: black; border-radius: 50%; }

When you used index.html & style.css then show below-