Tips al definir tu CSS para una web seria y formal
¿A que tú también te has dado con páginas web cuyo diseño gráfico no tiene nada que ver con sus contenidos o con lo que quiere transmitir? Se da una disonancia entre los contenidos y la presentación, que sin dudas repercute (para mal) en la experiencia del visitante, y en definitiva conspira contra la finalidad … Lee más!
Efecto POP en cajas con CSS
Si deseas lograr un efecto POP en las cajas de texto, en este artículo te enseñaré cómo debes hacerlo. Viendo a Chris Coyier quise compartir este artículo, en el que aprenderás a crear este llamativo efecto con las cajas de texto realizado integramente con CSS, como el de Pop Agency. Ejemplo en Codepen Las cajas … Lee más!
Limpiar floats con overflow
Uno de los problemas más comunes cuando usamos floats es que el contenedor wrapper que envuelve a los demás elementos no se expande a la altura de los elementos hijos. La solución típica a esto es añadir un elemento con clear float después de los elementos flotantes o un clearfix al wrapper. Otra solución, vía … Lee más!
Normalize, la moderna alternativa a los Reset CSS
Muchos de nosotros hemos estado usando a lo largo de los últimos años, varias técnicas para resetear CSS, debido a que muchos navegadores tienen su propio CSS y es mejor tener todo el CSS estandarizado, pero resetear CSS tiene algunas desventajas y está anticuado hoy en día, así que una alternativa que seguramente estaréis usando … Lee más!
Mostrar imagen al hacer click en botón con CSS y JS
Hace unos días tuve que ayudar a una compañera de facultad para que pudiera realizar un trabajo de fin de carrera. Se trataba de mostrar una imagen que en principio se encontraba oculta, al hacer click en un botón. Algo bastante simple pero que muy poca gente sabe hacer de manera correcta. A continuación, te mostraré … Lee más!
Falso subrayado con CSS
Seguro que muchos de vosotros habéis subrayado alguna vez una frase o palabra para darle importancia. Bien, con CSS se puede hacer, una es mediante text-decoration: underline;”, la otra es creando un borde inferior (border-bottom), esta última sería un subrayado falso. ¿Cómo sería el ejemplo? Muy sencillo. Un subrayado real, sería de esta forma: Código HTML … Lee más!
La evolución actual en el diseño web
A lo largo del tiempo, las necesidades de los clientes hacia los diseñadores ha ido cambiando. Esto es así porque la web tiene tendencias, es como la moda, cada poco tiempo se actualiza, y tiene mejor disponibilidad y novedades hacia el usuario final. La pequeña empresa, actualmente, pide diseños que sean simples y sencillos a … Lee más!
CSS Transparencia cross-browser
La transparencia (CSS Transparency) es una de las propiedades más polémicas y que requieren un montón de propiedades y valores para asegurar la compatibilidad en todos los navegadores (cross-browser). Aunque, por lo menos cada línea para cada navegador no se interfieren las unas con las otras, si no que si usamos una propiedad indicada para … Lee más!
Crear diseño responsive en 3 pasos
Actualmente se habla mucho de los diseños responsive, de hecho hace poco publiqué una lista de frameworks responsive y de plantillas responsive. Aunque, los más novatos pueden tener dudas acerca qué es el diseño responsive, y a ellos va dirigido este artículo, en el que aprenderás a diseñar de manera responsive en 3 simples pasos, … Lee más!
Efectos JQuery y CSS para menús drop-down
En este artículo quiero compartir unos efectos para menús desplegables contigo. La idea es transformar un input simple en algo llamativo gracias al uso de JQuery. Podemos configurar las opciones como deseemos para lograr efectos únicos. El plugin JQuery que se utiliza permitirá estilizar la lista desplegable, gracias a JQuery y CSS. Recuerda que CSS … Lee más!
9 bonitos efectos con box shadow
Hace tiempo hice un artículo en el que explicaba qué era box shadow. Ahora, he pensado que sería ideal hacer uno para gente más avanzada, con el que aprenderán a realizar efectos con box shadow, para que sus diseños queden novedosos y sofisticados, de forma simple y sencilla. Todos los efectos son completamente funcionales … Lee más!
10 frameworks responsive gratis
En el artículo anterior vimos 10 plantillas responsive gratis que os ayudarán a que tu diseño se adapte a los distintos tamaños de pantalla. A continuación mostraré una útil recopilación de responsive CSS Frameworks que te harán la vida más fácil y sencilla cuando estés diseñando sitios web. Estos frameworks vienen con layouts, grids y media … Lee más!
