Este blockquote tiene la particularidad detener un efecto hover, cada ves que el mouse pase por encima del blockquote tendrá un efecto brillo.
Antes de comenzar veremos una demostración:
Comencemos:
- Paso 1: Vamos a Blogger>>Plantilla>> Edición HTML.
- Paso 2: Buscamos la siguiente linea (Ctrol + F).
blockquote {
font-family: "Consolas", "Courier New", Courier, mono, serif;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #F7F7F7;
border : 1px solid #EEEEEE;
-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
font-size:15px;
}
blockquote:hover {
background-color:
white;
border: 1px solid
#ACACAC;
-moz-box-shadow: rgba(0,0,0,.2) 0 4px 16px;
-webkit-box-shadow:
rgba(0, 0, 0, .2) 0 4px 16px;
box-shadow:
rgba(0, 0, 0, .2) 0 4px 16px;
}
- Paso 3: Guardamos los cambios efectuados en la plantilla
Ahora agregaremos el efecto Blockquote para Blogger
- Paso 4: Dentro de una entrada pegamos el siguiente código HTML.
<blockquote>Texto que mostraremos</blockquote>
Hola amigo como haces para poner ese marco azul donde copiamos los codigos que se ve chevere tambien tengo otra pregunta eh visto en varios blog donde dividen el contenido de cada entrada por cuadros que estan organizados por descripcion, contenido y os link todo dividido como en este blog http://conocimientoadictivo.blogspot.com/2013/06/cinema-4d-studio-r14014-final-todo-lo.html asi las divisiones como se arian saludos
ResponderEliminar@Carlos Pavon El marco azul que tu dices son creados por Blockquote o cita, esta entrada nos referimos a eso.
ResponderEliminarSobre la pagina que tu me dices sobre que esta divida en cuadros eso se denomina tab (o tambien conocidas como tablas).
Ya que me has pedido eso, tengo una tutorial sobre eso y en estos días la creare.
Espero que te halla ayudado en algo
Gracias amigo por tu respuesta saludos
ResponderEliminar