Skip to main content

html code for buttons hover and link hover

This was on Biomin voco slider

Onto the code of the page, html

 <button class="greenol-button">Your text here</button>

Into the CSS Style sheet put

/* green outline background Button design */
.greenol-button, {
color: #2FA836 !important;
font-size: 16px;
background-color: #fff;
border-color: #2FA836 !important;
border-width: 1px !important;
border-style: solid;
border-radius: 5px !important;
padding: 10px;
}

.greenol-button a {
    color: #2FA836 !important;
    cursor: pointer;
    text-decoration: none;
}

.greenol-button:hover {
    color: #fff !important;
	background-color: #2FA836;
    border-color: #2FA836 !important;
    cursor: pointer;
    text-decoration: none;
    padding: 10px;
}

.greenol-button:hover a{
    color: #2FA836 !important;
}



/* green background Button design */
.green-button, {
color: #fff !important;
font-size: 16px;
background-color: #2FA836;
border-color: #2FA836 !important;
border-width: 1px !important;
border-style: solid;
border-radius: 5px !important;
padding: 10px;
}

.green-button a {
    color: #fff !important;
    cursor: pointer;
    text-decoration: none;
}

.green-button:hover {
    color: #2FA836 !important;
	background-color: #fff;
    border-color: #2FA836 !important;
    cursor: pointer;
    text-decoration: none;
    padding: 10px;
}

.green-button:hover a{
    color: #2FA836 !important;
}

  • Hits: 16