C
chuster
Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola, estoy creado mi web, he añadido unos botones que se adecuan perfectamente a lo que buscaba pero el problema que me ha surgido es que no tengo grandes conocimientos en html y css por lo que recurro aquí. He estado investigando algo pero no doy con la clave, a ver si por aquí me pudierais ayudar y así también a otras personas que tengas el mismo problema.
La cuestión es que me gustaría que el botón se abriera en una nueva ventana, he estado leyendo que hay que añadir tarjet black pero no sé dónde correspondería, uso blogger. Dejo por aquí los códigos utilizados para dichos botones y a ver cómo se podría solventar. Muchisimas gracias de antemano.
CSS UTILIZADO EN LA PLANTILLA
La cuestión es que me gustaría que el botón se abriera en una nueva ventana, he estado leyendo que hay que añadir tarjet black pero no sé dónde correspondería, uso blogger. Dejo por aquí los códigos utilizados para dichos botones y a ver cómo se podría solventar. Muchisimas gracias de antemano.
HTML:
<button class="button" onclick="location.href='URL';" style="vertical-align: middle;"><span>TEXTO</span></button>CSS UTILIZADO EN LA PLANTILLA
Insertar CODE, HTML o PHP:
.button {
position: relative;
background-color: #86B74D;
border: none;
border-bottom: 2px solid #001f3f;
font-size: 15px;
color: #FFFFFF;
padding: 15px;
width: 170px;
transition-duration: 0.4s;
text-decoration: none;
overflow: hidden;
cursor: pointer;
margin:10px;
}
.button:after {
content: "";
background: #86B74D;
display: block;
position: absolute;
padding-top: 300%;
padding-left: 350%;
margin-left: -20px !important;
margin-top: -120%;
opacity: 0;
transition: all 0.8s
}
.button:active:after {
padding: 0;
margin: 0;
opacity: 1;
transition: 0s
}
.button span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.5s;
}
.button span:after {
content: '\00bb';
position: absolute;
opacity: 0;
top: 0;
right: -20px;
transition: 0.5s;
}
.button:hover span {
padding-right: 25px;
}
.button:hover span:after {
opacity: 1;
right: 0;
}