Yanıp sönen neon efektli buton
<style>
.neon-btn {
position: relative;
display: inline-block;
padding: 15px 30px;
color: #fff;
letter-spacing: 4px;
font-size: 24px;
text-decoration: none;
overflow: hidden;
transition: 0.2s;
background: #000;
box-shadow: 0 0 10px #2196f3, 0 0 40px #2196f3, 0 0 80px #2196f3;
cursor:pointer;
border-radius: 5px;
}
.neon-btn:hover {
background: #2196f3;
color: #255784;
box-shadow: 0 0 10px #2196f3, 0 0 40px #2196f3, 0 0 80px #2196f3;
}
@keyframes neon-pulse {
0% {
box-shadow: 0 0 10px #2196f3, 0 0 40px #2196f3;
}
50% {
box-shadow: 0 0 20px #2196f3, 0 0 60px #2196f3;
}
100% {
box-shadow: 0 0 10px #2196f3, 0 0 40px #2196f3;
}
}
.neon-btn {
animation: neon-pulse 1.5s infinite;
}
</style>
<a type="button" onclick="javascript:void(0)" class="neon-btn">NEON BUTON</a>
<head>
bölümüne CSS kodlarını ekleyin</body>
etiketinden önce ekleyin