JSFiddle - React, Tailwind, and code Playground
by Kocsten
HTML
<div class="kuzagerul_opzamugdsa">
<p><a href="#">Ссылка на сайт Zornet.Ru</a></p>
</div>
CSS
.kuzagerul_opzamugdsa a {
color: #3399FF;
text-decoration:none;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
position: relative;
display:inline-block;
}
.kuzagerul_opzamugdsa a:hover {
color: #337AB7;
text-decoration:none;
}
.kuzagerul_opzamugdsa a::before {
position: absolute;
top: 100%;
right: 0;
width: 100%;
height:1px;
background: #3399FF;
content: '';
opacity: 0;
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
-moz-transition: opacity 0.3s, -moz-transform 0.3s;
transition: opacity 0.3s, transform 0.3s;
-webkit-transform: translateY(6px);
-moz-transform: translateY(6px);
transform: translateY(6px);
pointer-events: none;
}
.kuzagerul_opzamugdsa a:hover::before,
.kuzagerul_opzamugdsa a:focus::before {
opacity: 1;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
transform: translateY(0px);
}