<body>
  <!-- Bouton personnalisé au survol -->
  <button class="bouton">Je suis un bouton personnalisé au survol</button>

</body>
 .bouton{
                                        display: block;
                                        background-color: #719fee;
                                        border-radius: 10px;
                                        border: 4px double #1f69ec;
                                        color: #ffffff;
                                        text-align: center;
                                        font-size: 20px;
                                        padding: 10px;
                                        width: 200px;
                                        cursor: pointer;
                                        -webkit-transition: all 0.5s;
                                        -moz-transition: all 0.5s;
                                        -o-transition: all 0.5s;
                                        transition: all 0.5s;
}
                                .bouton:hover{
                                        background-color: #ffffff;
                                        border: 2px solid #1f69ec;
                                        box-shadow: 10px 5px 5px #719fee;
                                        color: #1f69ec;
                                        text-align: center;
                                        font-size: 22px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.