button Archives - scmGalaxy https://www.scmgalaxy.com/tutorials/tag/button/ A Platform for Software Engineers Wed, 13 Apr 2022 16:34:28 +0000 en-US hourly 1 https://wordpress.org/?v=7.1 Different ways to write the transitions in any tag or button using HTML & CSS. https://www.scmgalaxy.com/tutorials/different-ways-to-write-the-transitions-in-any-tag-or-button-using-html-css/ https://www.scmgalaxy.com/tutorials/different-ways-to-write-the-transitions-in-any-tag-or-button-using-html-css/#respond Tue, 31 Aug 2021 12:40:10 +0000 https://www.scmgalaxy.com/tutorials/?p=8551 In this blog, I am creating different transitions in buttons & div using HTML & CSS. So, Let’s create an […]

The post Different ways to write the transitions in any tag or button using HTML & CSS. appeared first on scmGalaxy.

]]> 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-

When you used the cursor then shows transitions property hover effects.

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-

When you used the cursor then show transition hover effects.

The post Different ways to write the transitions in any tag or button using HTML & CSS. appeared first on scmGalaxy.

]]> https://www.scmgalaxy.com/tutorials/different-ways-to-write-the-transitions-in-any-tag-or-button-using-html-css/feed/ 0