Simple Cool Text Hover Effect Part 7
Simple and cool text hover effect in CSS
/*CSS*/
*,*::before,*::after{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
font-family: sans-serif;
width: 100%;
min-height: 100vh;
background: radial-gradient(#D9D9D9, #FFF);
display: flex;
align-items: center;
justify-content: center;
}
.container{
width: 540px;
}
.container span{
font-size: 5rem;
color: #FFF;
font-weight: 900;
text-shadow: 0 0 40px rgba(0, 0, 0, 0.4);
display: inline-block;
transition: transform 0.4s ease;
}
.container:hover span:nth-child(even){
transform: translateY(20px);
}
.container:hover span:nth-child(odd){
transform: translateY(-20px);
}
Watch video Simple Cool Text Hover Effect Part 7 online without registration, duration hours minute second in high quality. This video was added by user Masters In Web Design 19 January 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 7 once and liked it 2 people.