elWebmaster.com

CSS | estilos | botones

Crear un botón en estado “hover” sólo con CSS

Si bien no es muy utilizado, el estado CSS “active” de un link es el estado en que se pone un link cuando haces clic en él. El momento en que haces clic en un link, este se vuelve activo. Es por eso que el estado “active” puede resultar muy útil cuando posees botones de estilo personalizado.

Sencillamente mediante la utilización del estado “active” podremos darle a nuestros botones la apariencia de que están siendo presionados, o cualquier otro estilo que deseemos que tengan, para hacer que nuestro sitio se destaque. Seguir leyendo

19/ene/09, 10.15 Micaela 3 comentarios

Diseño | CSS | recursos

Typechart: dando formato a los párrafos de tu blog con CSS

Desde la web Xybernéticos nos traen una aplicación muy interesante que nos da la posibilidad de otorgarle diferentes formatos a los párrafos de nuestro sitio web.

Typechart nos permite comparar a tiempo real cómo se ve determinada tipografía tanto en Windows como en Mac OS X y una vez que estemos a gusto con el formato de esta podremos extraer su código CSS.
Seguir leyendo

26/sep/08, 11.25 Micaela Comentar

CSS | recursos | código

Encuentra los selectores inncesarios de tu CSS

Ya mencioné alguna vez la importancia de mantener el código de nuestro sitio limpio y ordenado para poder revisarlo sin mayores inconvenientes. La web CSS Redundancy Checker puede sernos de mucha ayuda en esta tarea.

CSS Redundancy Checker es una aplicación online que nos permitirá conocer cuáles son los selectores CSS de nuestro código que no están siendo utilizados por ningún archivo HTML y que, por lo tanto, son precisamente redundantes.
Seguir leyendo

01/sep/08, 16.00 Micaela Comentar

CSS | código | estilos

Uso avanzado de CSS con reglas “arroba”

Uso avanzado de CSS con reglas arrobaMás allá de las funciones que uno generalmente usa en las hojas de estilo CSS (como los selectores) existen reglas menos comunes, como las “reglas @” (at-rules, en inglés). Este tipo de reglas tienen usos muy diversos y algunas son específicas de ciertos navegadores.

Las reglas @ comienzan siempre con el símbolo de la arroba y luego su nombre clave. Dependiendo de cual se trate podrá necesitar un único argumento (la regla “import por ejemplo) o un bloque de código (la regla “media“). Veamos bien cuáles son. Seguir leyendo

05/ago/08, 16.00 Micaela Comentar

Diseño | CSS | recursos

Plantillas CSS gratuitas para tu página web

Plantillas CSS gratuitas para tu página webLos que tengan poca idea sobre CSS o simplemente quieran usar uno de estos excelentes layouts, pueden descargarlos directamente desde el sitio de Intensivstation.ch. Las plantillas sólo tienen organización de sectores y color, de modo que puedes ponerles tus imágenes o texto.

Para facilitarte aún más las cosas se encuentran organizadas por categorías: ajustadas, elásticas, centradas, de una, dos o tres columnas, etc. Todas cumplen con los estándares y tienen XHTML y CSS2 válidos. Haz clic aquí para ir al sitio.

19/jun/08, 12.15 Juan Manuel 1 comentario

Diseño | CSS | html

Los jardines Zen del CSS: El camino a la iluminación

Los jardines Zen del CSS: El camino a la iluminaciónCss Zen Garden es una demostración de lo que se puede lograr visualmente a través del CSS. Su propósito es que el css sea tomado en serio por los artistas gráficos y demostrar el gran valor de separar la maquetación HTML del diseño.

Básicamente, consiste en una página donde distintos usuarios suben sus hojas de estilo. Lo interesante es ver cómo podemos cambiar los distintos diseños pero el código html es siempre el mismo. Seguir leyendo

17/jun/08, 16.00 Micaela Comentar

Diseño | CSS | recursos

Creando un mapa interactivo con CSS

Creando un mapa interactivo con CSSNo necesariamente tiene que tratarse de un mapa geográfico, sino que puede ser cualquier mapa de imagen que al pasar el puntero del mouse por encima despliegue información adicional, otras imágenes, etc. Todo con CSS.

En la web de MikeCherim.com tenemos un ejemplo para que veamos cómo funciona y también desde allí podemos descargar los archivos XHTML y CSS necesarios para que revises el código y lo uses en tu sitio web. Haz clic aquí para ir al sitio.

05/jun/08, 13.36 Juan Manuel 2 comentarios

Diseño | CSS | fotos

Galería de imágenes que se amplían con CSS

Galería de imágenes que se amplían con CSSHoy en día todo lo que a diseño y presentación en un sitio web se refiere se hace con estilos CSS, por lo que siempre vienen bien estos trucos para aplicar algún detalle de calidad a nuestra página, claro, respetando los estándares.

Si tienes una galería de imágenes con vistas previas puedes usar este sencillo truco para ir ampliando las fotos al pasar el puntero del mouse por encima. Como utiliza la propiedad overflow, no desarma el diseño del sitio, además es muy veloz. Seguir leyendo

04/jun/08, 16.12 Juan Manuel 3 comentarios

Diseño | Trucos | CSS

Los 12 trucos de CSS más usados… y necesarios

Los 12 trucos de CSS más usados… y necesariosAhora todo se maqueta y/o diseña con CSS. Los potentes estilos reducen el peso de la página, permiten que el HTML se centre en un sentido “semántico” y se posicione mejor en los buscadores, así como también nos permiten rediseñar un sitio entero en dos patadas.

Por eso son tan útiles esos pequeños trucos de bolsillo que uno suele ir recolectando por ahí, para echar mano en un momento de necesidad. Con gusto te dejo esta lista de 12 trucos de CSS que a mi modo de ver son muy usados y también muy necesitados. Seguir leyendo

22/may/08, 12.35 Juan Manuel 21 comentarios

Diseño | CSS | tipografía

7 fuentes tipográficas que seguro no usas en CSS, aunque podrías

7 fuentes tipográficas que seguro no usas en CSS, aunque deberíasLos estilos CSS nos trajeron muchas ventajas en cuanto al diseño de nuestros sitios web, pero por alguna razón parece que estamos limitados al uso de 4 o 5 tipos de fuentes que están presentes en cualquier computadora, por miedo a que las demás no se visualicen correctamente.

Así es como no vemos otra cosa que Arial, Helvetica o Georgia en la mayoría de los blogs de la red. Pero hoy en día tenemos una gama más amplia de opciones a la hora de elegir, siempre dentro de las fuentes “seguras”. Te recomiendo 7 que sin duda deberías tener en cuenta. Seguir leyendo

12/may/08, 16.12 Juan Manuel 3 comentarios

© 2007 - 2008 elWebmaster.com | Powered by Wordpress | Diseño CSS y XHTML válido. | Algunos íconos basados en FamFamFam Mini
Acceder