TEMAS de CSS

Mostrando del 41 al 50 de 93 registros
Imágen de perfil

internetCómo mejorar el rendimiento de las animaciones con CSS


CSS

Publicado el 3 de Diciembre del 2013 por Administrador
1.897 visualizaciones desde el 3 de Diciembre del 2013
Los navegadores web modernos pueden aplicar con facilidad los siguientes cuatro efectos CSS: cambio de posición, escalado, rotación y opacidad. Si aplicas cualquier otro efecto CSS en la página, es muy posible que el rendimiento se resienta y no puedas mantener los 60 frames por segundo que hacen que la página se vea tan bien. Que hacer en estos casos.
Imágen de perfil

internetCómo utilizar entidades HTML en el contenido generado por CSS


CSS

Publicado el 1 de Octubre del 2013 por Administrador
3.178 visualizaciones desde el 1 de Octubre del 2013
La propiedad content de CSS permite añadir dinámicamente contenidos en las páginas HTML. Aunque siempre debe utilizarse con moderación, es una solución muy útil para añadir pequeños contenidos sin tener que modificar la página HTML y sin tener que utilizar JavaScript para manipular la página.
Imágen de perfil

internetAprende a usar los pseudo-elementos :before y :after en CSS


CSS

Publicado el 23 de Julio del 2013 por Administrador
22.196 visualizaciones desde el 23 de Julio del 2013
Los pseudo-elementos :before y :after se utilizan junto con la propiedad content para añadir contenidos antes o después del contenido original de un elemento. En este artículo vamos a ver a fondo qué son los pseudo-elementos :before y :after, y cómo sacarles el máximo partido en nuestros diseños web.
A pesar que la W3C incluye otros pseudo-elementos, como son los conocidos :link, :hover o no tan conocido :first-child, en este artículo nos vamos a centrar exclusivamente en los pseudo-elementos :after y :before y explorar algunas de las cosas que podemos hacer con ellos para enriquecer nuestros diseños.
Imágen de perfil

internetMover las cosas con animaciones CSS


CSS

Publicado el 20 de Junio del 2013 por Administrador
9.608 visualizaciones desde el 20 de Junio del 2013
Tradicionalmente, la web era un lugar muy estático. Animace no era posible de ninguna manera cuerda hasta la llegada de JavaScript, los GIFs animados y Flash, momento en el que nos regocijamos y aplaudimos la gran cantidad resultante de 'saltar intro' y horribles animaciones molestas.

Estaba todo muy bien, pero seguía sin haber manera para que los no desarrolladores creasen animaciones con estándares abiertos. Puedes dar salida a todos los argumentos religiosos que desees sobre que la animación que pertenece a la capa de comportamiento, y no a la capa de presentación, pero creo que la animación definitivamente cae en el ámbito del diseño. Y ahora, con las transiciones y animaciones CSS3, se pueden animar los elementos de nuestro sitio web. ¡Diseño web basado en estándares con más diversión! Y más 'saltar intro', si lo prefieres…

Opera tiene soporte para transiciones desde hace mucho tiempo, y ya hemos escrito sobre ellos en CSS3 transitions and 2D transforms. Este artículo se centra en la otra manera de animar las cosas usando hojas de estilo: las animaciones CSS. A continuación daremos una introducción concreta incluyendo el estado de la especificación y el soporte en navegadores, las diferencias entre animaciones y transiciones, la sintaxis básica, y una lista de ejemplos.
Imágen de perfil

internetRecopilación de siete tutoriales sorprendentes de CSS3


CSS

Publicado el 19 de Junio del 2013 por Administrador
9.804 visualizaciones desde el 19 de Junio del 2013
Para los que están pensando en iniciar el año aprendiendo CSS3, aquí tenéis un recopilatorio de tutoriales que muestran diferentes aspectos o funcionalidades que podemos aplicar en nuestros proyectos. No hace falta explicar la importancia que tiene CSS para el desarrollo web. En ocasiones he encontrado soluciones utilizando muchas y engorrosas líneas en JavaScript que fácilmente se podrían haber resuelto conociendo debidamente las funcionalidades de CSS.
1. Botones CSS con pseudo-elementos.
2. Diseños angulares.
3. Banners animados.
4. Lightbox con transición.
5. Estados por filtrado de imagenes.
6. Diapositivas 3D.
7. Botones YouTube.
Imágen de perfil

internetOptimizar CSS, 12 consejos y 4 herramientas


CSS

Publicado el 24 de Mayo del 2013 por Administrador
11.839 visualizaciones desde el 24 de Mayo del 2013
Simple y llano. Aprende a optimizar tus códigos CSS a través de estos 12 consejos y 4 herramientas.
Imágen de perfil

internetResponsive Slider utilizando FlexSlider


CSS

Publicado el 8 de Mayo del 2013 por Administrador
13.393 visualizaciones desde el 8 de Mayo del 2013
En este pequeño tutorial vamos a crear un slider animado con jquery y lo vamos a hacer responsive, es decir que se adapte a cualquier dispositivo que el visitante este utilizando, para esto vamos a trabajar con un plugins que nos facilitara el trabajo, se trata de FlexSlider un plugins de Jquery de código abierto que nos facilitará este trabajo y lo optimiza para los dispositivos móviles.
Imágen de perfil

internetCSS. Menús flotantes


CSS

Publicado el 7 de Mayo del 2013 por Administrador
10.063 visualizaciones desde el 7 de Mayo del 2013
Muchas son las propuestas para insertar menús en nuestras páginas Web, típicamente se han utilizado desde simples esquemas con hipervínculos, listas numeradas, rutinas en JavaScript, applets de Java, plug-ins de Abobe Flash, … por citar algunas soluciones populares.
En el presente artículo presentamos una alternativa que consideramos solvente y muy eficiente en varios aspectos, como su apariencia totalmente personalizable y facilidad de programación, o como en el escaso sobrecosto que puede suponer para el transito a través de Internet, tanto en tamaño, como en código potencialmente peligroso. Lo que entraría en el ámbito más general de la optimización de código HTML.
Nos basaremos en la aplicación de estilos a listas no ordenadas de entradas con hipervínculos –que serán las opciones del menú resultante-, convirtiendo dichas listas en verdaderos menús flotantes, con la toda la apariencia y prestaciones de los habitualmente utilizados.
A modo de resumen, trataremos:
1. La aplicación de los estilos básicos para la conversión en un menú
2. Control de anchos, fuentes y cursores
3. Menús horizontales y verticales
4. Menús con efectos de bordeados, sombras, centrados y demás
Imágen de perfil

internetMaquetando un site en 3 columnas!! con CSS


CSS

Actualizado el 1 de Mayo del 2013 por Administrador (Publicado el 22 de Febrero del 2012)
11.818 visualizaciones desde el 22 de Febrero del 2012
Aprende a maquetar tu site en 3 columnas con CSS.
Imágen de perfil

internetGoogle Font Directory: tipografías libres para la web


CSS

Publicado el 17 de Abril del 2013 por Administrador
11.692 visualizaciones desde el 17 de Abril del 2013
Vamos a ver como embeber una tipografía en tu página desde Google para que el usuario vea la web tal y como la diseñes, aunque no sea una fuente de uso común.