CSS Avanzado
CategoríaRecursos y guías sobre CSS a nivel avanzado.
Selector de ventanas de Opera Mobile con CSS y Jquery
Con JQuery podemos crear cosas realmente sorprendentes y divertidas, como menús, carruseles o pestañas . Es muy enorgullecedor recrear algo que ya existe y con lo que estás disfrutando, pero realizarlo con otro lenguaje. Con JQuery podemos crear el selector de ventanas de Opera Mobile, así, varias ventanas que están superpuestas una debajo de otra, … Lee más!
Detectar iPhone o iPad con CSS3 Media Queries
Los dispositivos como iPad e iPhone cada vez están más cerca de nuestra vida cotidiana, por ello hay que adaptarse a los nuevos tiempos y crear, estilizar y construir páginas adaptadas a los nuevos medios. De una manera muy sencilla, con el uso de CSS3 Media Queries podemos detectar si el usuario está usando un … Lee más!
Usar el objeto Browser de Mootools para crear condicionales CSS
Si deseamos crear condicionales CSS para que una porción del código únicamente sea leído por X navegador, utilizando el objeto Browser de Mootools, solo deberemos seguir estos pasos: // Conseguimos la etiqueta HTML var htmlTag = document.id(document.documentElement); // El nombre de la clase se agrega al navegador htmlTag.addClass(Browser.name); // Se añade la clase de la … Lee más!
Convierte imágenes a CSS con Jpeg2css
Jpeg2css nos permitirá convertir imágenes a CSS, aunque no es apto para novatos, ya que el proceso es bastante complicado si no estás familiarizado con CSS. Funciona mejor en imágenes que representen siluetas en blanco y negro, ya que su forma de procedimiento consisten en convertir cada pixel de la imagen en un div (que … Lee más!
El futuro de GTK+ será CSS
Carlos Camacho, programador de GNOME, mostró que la personalización y configuración de interfaces GTK+ (paquete de herramientas para la creación de interfaces gráficas de usuario) será igual a cómo se editan las hojas de estilo (CSS). Esto elevará la configuración a un nuevo nivel, dicen que ha sido una de las características que más se … Lee más!
Un hombre que anda gracias a CSS
Está claro que con CSS se pueden hacer maravillas, existen un montón de usos útiles y demostraciones que podemos realizar con CSS. Andrew-Hoyer nos presenta una creación suya, un experimento, en el que se puede comprobar cómo se mueve un hombre (que casualmente es él) gracias a CSS3, nada de Javascript. Aunque existen fallos en … Lee más!
Interesantes perspectivas de las sombras con CSS
La propiedad box-shadow, una de las nuevas opciones de CSS3, se ha convertido en la opción ideal para crear sombras en las cajas. Aplicando sombras a la pseudo-clases ::before y ::after, crearemos útiles perspectivas con la sombra. Allá vamos: Código HTML <div class=”box”> <img src=”cssblog.png” alt=”cssblog” /> </div> Código CSS .box:after { content: ”; position: … Lee más!
Construir un cubo 3D con HTML5 y CSS3
HTML5 y CSS aportan nuevas novedades a los diseñadores, muy útiles y más fáciles de implementar que las de CSS2. Os enseñaré a crear un cubo 3D con CSS, parecido al que os mostré anteriormente. Las letras del cubo son las siglas del logotipo de WebProNews. Para empezar, necesitamos 3 imágenes separadas, cada imagen de … Lee más!
Burbujas de texto con CSS
Las burbujas de texto son un efecto popular pero la mayoría de ellas se crean con HTML o Javascript. Este tutorial contiene varios ejemplos de efectos de burbujas de texto creados con CSS 2.1 y personalizados con CSS3. Como dije anteriormente, no contiene imágenes, Javascript y puede aplicarse a tu HTML semántico. Por ahora soporta … Lee más!
CSS-JS-Booster, combina y comprime CSS y JS
CSS-JS-Booster es un script PHP que optimizará la carga de tu sitio web, que cuenta con interesantes características: Combina múltiples archivos CSS dando como resultado un menor número de consultas al servidor Reduce el código CSS necesario Etiqueta las imágenes menores de 24 KB como data-URI o MHTML (para IE <= 7) Comprime el CSS … Lee más!
Centage, un framework avanzado basado en CSS/LESS
Centage es un framework complejo orientado a crear simples y avanzadas estructuras fácilmente. Está basado en less.js, una implementación en Javascript de less.css, y hace uso de sus funciones avanzadas, como pueden ser las variables, mezclas y la jerarquización. No utiliza ningún valor en píxeles, menos la expansión y compresión dependiendo de la anchura del … Lee más!
8 técnicas CSS aleatorias que deberías conocer
El CSS es la piedra angular de todo diseño web. Su sintáxis, aparantemente sencilla, afecta directamente al aspecto visual de nuestro front-end. En este artículo quiero comentaros ocho técnicas CSS que os resultarán muy útiles en futuros proyectos. Trabajando con medidas relativas Si queremos utilizar medidas relativas (em), para las tipografías de nuestros diseños, es … Lee más!
