Ca vous intéresse de savoir comment on fait un bouton en HTML/CSS avec un effet de hover des plus sympathiques ? Rapidement et facilement en plus ? Vous êtes au bon endroit !

Regardez la vidéo ci-dessous ⬇ et apprenez à réaliser un super bouton 👍

Retrouvez aussi le code HTML et CSS juste en dessous !

Le bouton dans le HTML

<button class="btn">Tuto bouton CSS</button>

Le style du bouton dans le CSS

.btn{
    background-color: transparent;
    border: 2px solid red;
    border-radius: 20px;
    color: red;
    cursor: pointer;
    padding: 20px;
    text-decoration: none;
    text-align: center;
    text-transform: uppercase;
    transition: background-color 300ms, color 300ms;
}

.btn:hover{
    color: #fff;
    background-color: red;
}