FELIZ NAVIDA

  Podéis colocar este regalo de navidad casi en cualquier parte de vuestro blog, he modificado el  código con este fin. El original lo hallaréis en  un espacio que me fascina y en el que sus usurarios hace cosas increíbles, codepen, os recomiendo que lo visitéis para tomar inspiración. El código modificado lo encontraréis haciendo clic en el nuevo año, del ejemplo que veras si sigues leyendo.

TODOS LOS CURSORES

 El cursor suele ser un elemento imprescindible en una página, pero además puede dar al usuario mucha  información, puede indicarle la función que realiza cada elemento y ayudarlo a distinguir los distintos espacios de una misma página.

Por esto hoy voy a indicaros  literalmente, los distintos cursores que existen definidos en CSS para HTML 

Un pequeño código en el que podréis probarlos a vuestro antojo sería este:                                           <h4 style="cursor: el cursor">Pasa el ratón</h4>

Flexbox nos ahorra líneas de código

 Hoy voy a hacer una breve referencia a uno de los nuevos valores HTML 5 para  CSS: Flex,  bastante bien explicado en esta página a la que os dirijo Platzi  Y también a un nuevo diseño de caja flexible con Flexbox. 

Ciertamente, estos términos para quienes tenemos unos conocimientos limitados en CSS, parece chino, pero lo que nos interesa es su practicidad e indagar que puede hacerse con estos dos  conceptos, y creedme que puede hacerse mucho y con muy pocas líneas de código, que es de lo que se trata. 

Os dejo un ejemplo de página responsve realizada con estos nuevos términos, y el código correspondiente en mi otro blog,

BARRA DE DESPLAZAMIENTO ACTIVA PERO INVISIBLE

Un pequeño código y las barras de desplazamiento de tu blog desaparecerán, pero seguirán siendo útiles, funciona también en las nuevas plantillas de blogger en la sidebar.

TEXTOS PERFECTOS

   Hoy os voy a dirigir a un espacio que a mi me ha sido de mucha utilidad, mclibre es una web, llena de referencias a los distintos lenguajes y recursos de programación. 
Este enlace aprende-web concretamente os lleva a un apartado, en el que se comentan prácticamente todas las propiedades que se pueden aplicar al texto de una página o entrada utilizando css
El ejemplo que os dejo a continuación, da muestra de una de estas propiedades, text-shadow, que permite añadir una o varias sombras al texto. 

Cambiar el estilo del mensaje del widget bloglist "Mostrar todo"

   Esas listas de blogs amigos que solemos colocar a modo de deferencia o de muestra de aquellos que nos gustan especialmente, en ocasiones terminan siendo muy largas y nos vemos obligados a mostrar solo unos cuantos, y dejar ocultos tras el insulso mensaje de "Mostrar todo", al resto.
¿Verdad que nos gustaría que fuera más visible y original? Pues puede conseguirse, no os desaniméis ni penséis que es complicado aunque en un principio lo parezca, porque no lo es en absoluto, solo os pido que tengáis en cuenta mi recomendación, si la que aparece bajo este articulo.

¿Cómo llevar a cabo esta mejora?. Comencemos:

Seamos seguidores

La iniciativa "Seamos seguidores" es para ayudarnos entre bloggers.

Soy una apasionada de los Blogs, los sigo, para poder acudir a ellos una y otra vez, tal es mi pasión, que he creado una blogoteca, para que no se me olvide ninguno y poder estar al día de sus publicaciones.

Seguir un blog, es dotarlo de vida y darle a su autor ese empujoncito que a veces le hace falta para seguir adelante.
No obstante, yo solo sigo lo que me gusta o lo que intuyo puede llegar a gustarme, tengo una mente abierta, jejeje. Espero que vosotros hagáis lo mismo.

¿PARA PARTICIPAR?

Simplemente tienes que seguirme y dejar en un comentario el enlace de tu blog para que así también te siga yo ( he de decir que en muestra de respeto yo siempre sigo a quien me sigue). También puedes hacer una entrada para que tus seguidores conozcan esta iniciativa.

Un enlace con referente

   A la gente le gusta saber a donde se le dirige, a donde va, esta es una manera muy elegante de presentar vuestros link o enlaces, en este blog aL que os dirijo jejeje...

Entre lineas

Os gustaría el título de vuestras entradas entre líneas, pues esto es lo que tenéis que colocar antes de  ]]></b:skin>: si seguís leyendo comprobaréis lo que digo en mi propio título.

Clic para ver contenido oculto

Para vuestras entradas

¿Veis? Pues hoy veremos como hacer esto .
Lo primero sera introducir el codigo que genera este milagrito y si os conformáis con el ejemplo solo tendréis que cortar y pegar en vuestro editor en modo html y comenzar a escribir justo antes del cierre del "div", así vuestro texto adoptara el formato elegido.
Una aclaración importante, los saltos de linea o bien los introducís manualmente con "/br" o bien en las opciones de vuestro editor a la derecha, la ruedecita, marcáis la casilla que dice "pulsar intro para los saltos".
Si no quereis teclear este codigo cada vez que os apetezca utilizar este recurso lo que teneis que hacer es introducirlo después "b:skin" en la plantilla del blog y luego cuando creéis la entrada colocar vuestro editor en modo html y poner la sentencia "div class= stitched" que teneis al final del codigo que os dejo a continuación . No olvidéis cerrar el div una vez escrita la entrada.

Marco y Fondo sencillo con CSS y una capa

<div id="capa" style="background-color: Lavender; border: 10px solid Indigo; margin: 25px; padding: 25px; width: 50%;"> </div>

Mostrar tus redes sociales

SIN COMENTARIOS ACUDE A RADEANDO

• RSS Feed
• Facebook
• Twitter
• Google+

Un buscador original

 Hoy os presento un buscador muy original, de la mano de este blog que nunca me cansare de recomendar:

buscador ->

Textos actractivos

ANABELMIS

Este es un ejemplo de como transformar nuestros textos en algo diferente, más atractivos y llamativos!

Efectos con imágenes y CSS

Aquí encontrareis, efectos CSS tan atractivos como este.

Recomendación

   Hoy voy ha referiros una página que os recomiendo encarecidamente visitéis; aunque está en ingles es muy intuitiva y tiene multitud de ejemplos que pueden orientaros en el camino, no tan difícil, del los distintos códigos html, css...(podéis cambiar el idioma dándole al mundito de la parte de arriba)

No hay que tener sueños, hay que tener objetivos viables. Tuitear ésto

UN MENÚ CURIOSO EN CSS

• ¿ES ESTE EL ENLACE?
• TAL VEZ TENGAS SUERTE
• ¿ESTÁN AQUÍ?
• PUEDE QUE SEA ESTA
• ¿PAGINA DE LOS CÓDIGOS?

 Ya conocéis esta pagina ¿verdad? pues buscando cosas interesantes me tope con este menú, me gustó el efecto y su fácil adaptación, según sea el espacio donde se coloque el se acoplará automáticamente . 

Os indicare más o menos las cosas que podéis cambiar y las que debéis cambiar.

Frases Tuiteables en las Entradas del Blog

Hola queridos amigos, estoy de vuelta y regreso con algo que me ha parecido muy interesante: como el propio titulo indica, colocar frases originales, graciosas o incluso inteligentes en tu blog para que puedan ser retwiteadas,

UN EFECTO CHULO PARA UNAS NAVIDADES CHULAS

EL CÓDIGO

Aquí os dejo el código de el efecto de la imagen un beso enorme para todos::

<style>
.swing{
-webkit-animation:swinging 10s ease-in-out 0s infinite;
-moz-animation:swinging 10s ease-in-out 0s infinite;
animation:swinging 10s ease-in-out 0s infinite;
-webkit-transform-origin:50% 0;
-moz-transform-origin:50% 0;
transform-origin:50% 0;
} @-webkit-keyframes swinging{
0% { -webkit-transform: rotate(0); }
5% { -webkit-transform: rotate(10deg); }
10% { -webkit-transform: rotate(-9deg); }
15% { -webkit-transform: rotate(8deg); }
20% { -webkit-transform: rotate(-7deg); }
25% { -webkit-transform: rotate(6deg); }
30% { -webkit-transform: rotate(-5deg); }
35% { -webkit-transform: rotate(4deg); }
40% { -webkit-transform: rotate(-3deg); }
45% { -webkit-transform: rotate(2deg); }
50% { -webkit-transform: rotate(0); } /* Come to rest at 50%. The rest is just stillness */
100% { -webkit-transform: rotate(0); }
} @-moz-keyframes swinging{
0% { -moz-transform: rotate(0); }
5% { -moz-transform: rotate(10deg); }
10% { -moz-transform: rotate(-9deg); }
15% { -moz-transform: rotate(8deg); }
20% { -moz-transform: rotate(-7deg); }
25% { -moz-transform: rotate(6deg); }
30% { -moz-transform: rotate(-5deg); }
35% { -moz-transform: rotate(4deg); }
40% { -moz-transform: rotate(-3deg); }
45% { -moz-transform: rotate(2deg); }
50% { -moz-transform: rotate(0); } /* Come to rest at 50%. The rest is just stillness */
100% { -moz-transform: rotate(0); }
} @keyframes swinging{
0% { transform: rotate(0); }
5% { transform: rotate(10deg); }
10% { transform: rotate(-9deg); }
15% { transform: rotate(8deg); }
20% { transform: rotate(-7deg); }
25% { transform: rotate(6deg); }
30% { transform: rotate(-5deg); }
35% { transform: rotate(4deg); }
40% { transform: rotate(-3deg); }
45% { transform: rotate(2deg); }
50% { transform: rotate(0); } /* Come to rest at 50%. The rest is just stillness */
100% { transform: rotate(0); }
}
</style>
<img class="swing" src="AQUÍ LA URL DE VUESTRA IMAGEN" />