Códigos Fuente de CSS

Mostrando del 1 al 10 de 63 registros
<<>>
Imágen de perfil

Centrar un div


CSS

estrellaestrellaestrellaestrellaestrella(13)
Actualizado el 10 de Noviembre del 2015 por Administrador (Creado el 27 de Octubre del 2007)
160.753 visualizaciones desde el 27 de Octubre del 2007. Una media de 378 por semana
Código que muestra como centrar un div en el centro de la pantalla, tanto verticalmente como horizontalmente.
Probado en IE 5,6,7, Firefox 2 y Opera 9.
Imágen de perfil

Centrar un texto vertical y horizontal dentro de un div


CSS

Publicado el 10 de Noviembre del 2015 por xve
640 visualizaciones desde el 10 de Noviembre del 2015. Una media de 56 por semana
Este simple ejemplo, muestra como centrar de manera horizontal y vertical un texto dentro de un div

texto-centrado-vertical-y-horizontal-dentro-de-un-div
Imágen de perfil

Poner un vídeo de youtube encima de una imagen


CSS

Publicado el 22 de Octubre del 2015 por xve
807 visualizaciones desde el 22 de Octubre del 2015. Una media de 56 por semana
Este código posiciona un vídeo de youtube encima de una imagen de un monitor, simulando que el vídeo se emite desde una pantalla dentro de la web.

youtube-over-image


Este código lo he desarrollado para contestar una pregunta del foro de HTML.
Imágen de perfil

Animación en CSS3 que muestra como inclinar el logo de izquierda a derecha mientras esta el ratón encima


CSS

estrellaestrellaestrellaestrellaestrella(2)
Actualizado el 22 de Octubre del 2015 por xve (Creado el 12 de Octubre del 2015)
802 visualizaciones desde el 12 de Octubre del 2015. Una media de 49 por semana
Este simple código muestra como mover de izquierda a derecha el logo mientras tenemos el ratón encima de la imagen de manera indefinida.
Imágen de perfil

Mostrar el contenido de un iframe utilizando un porcentaje de la pantalla


CSS

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 09 de Agosto del 2015 por xve
1.381 visualizaciones desde el 09 de Agosto del 2015. Una media de 56 por semana
Como en la definición de un iframe no se puede poner un valor con porcentaje, aquí se muestra la manera de como hacerlo añadiendo el iframe dentro de un div.
Es muy útil para utilizar en diseños responsive.

Este ejemplo, muestra como utilizar dos iframes que ocupen el 20% y 80% de la pantalla.
Imágen de perfil

Dibujar una flecha con html y css


CSS

Publicado el 21 de Julio del 2015 por xve
1.655 visualizaciones desde el 21 de Julio del 2015. Una media de 63 por semana
Este código muestra como dibujar una flecha hacia la derecha, izquierda, abajo y arriba con HTML y CSS3 sin utilizar ninguna imagen.

flechas-html-css
Imágen de perfil

Menu desplegable para moviles con CSS3 y HTML5


CSS

Publicado el 19 de Marzo del 2015 por xve
3.417 visualizaciones desde el 19 de Marzo del 2015. Una media de 77 por semana
Aquí os muestro un sencillo ejemplo de como hacer un menú desplegable para ser utilizado en smartphones y tabletas.
El despliegue del menú se realiza con jquery

menu-movil-plegado

menu-movil-desplegado
Imágen de perfil

Rotación de palabras con efecto con CSS3


CSS

Publicado el 02 de Marzo del 2015 por xve
1.211 visualizaciones desde el 02 de Marzo del 2015. Una media de 28 por semana
En este simple código muestro como rotar un texto de forma vertical.

Menu de opciones


CSS

Publicado el 15 de Diciembre del 2014 por Matias
1.242 visualizaciones desde el 15 de Diciembre del 2014. Una media de 21 por semana
Les traigo un excelente menú estático y elegante, realizado con css y html.
Pueden verlo en acción en la pagina http://www.paginasweb-sistemas.com.ar

menu
Imágen de perfil

Como animar un height 0px a height:auto utilizando transition de CSS3


CSS

Publicado el 26 de Agosto del 2014 por Xavi
1.321 visualizaciones desde el 26 de Agosto del 2014. Una media de 21 por semana
Código que muestra como utilizar una transición de un height:0px; a un height:auto; utilizando transition de CSS3.

Para que funcione correctamente, en vez de utilizar height, utilizaremos max-height, de esta manera únicamente cogerá el tamaño necesario, que seria lo mismo que utilizar height:auto;