CSS Medio
CategoríaRecursos y guías sobre CSS a nivel medio.
Cómo mejorar la usabilidad de tu sitio con CSS
La usabilidad es muy importante de cara a cualquier proyecto, y más si este es importante, ya que habrá mayor diversidad de usuarios. Es necesario optimizar todos los elementos del sitio para conseguir una buena usabilidad. En esta entrada muestro 7 sencillos trucos para mejorar la usabilidad de nuestro sitio con CSS. Seleccionar con distinto … Lee más!
CSS Shorthand: La regla del reloj
Cuando empezamos con CSS, tendemos a poner las propiedades así: margin-top: 1px; margin-right: 1px; margin-bottom: 1px; margin-left: 1px; Pero, podemos agrupar todos estos valores en una sola propiedad, esto se suele llamar shorthand – Podéis ver esta guía para recordar valores en CSS Shorthand -. En el ejemplo anterior, quedaría así: margin: 1px 1px 1px … Lee más!
5 útiles y sencillas propiedades CSS
En esta entrada hablaré de 5 propiedades para CSS2 muy sencillas de utilizar, y que os sorprenderán de lo útiles que pueden llegar a ser. Estas propiedades son perfectamente compatible con la gran mayoría de los navegadores. Las propiedades que analizaré son clip, min-height, white-space, cursor y display. Allá vamos: dtsv.dtse_post_4141_permalink = ‘http://www.cssblog.es/5-utiles-y-sencillas-propiedades-css/’; dtsv.dtse_post_4141_title = … Lee más!
Soluciona una gran lista de errores en IE con IE7-JS
IE7-JS es una librería en Javascript (versión 2.0 beta) creada por Dean Edwards, que nos permitirá solucionar una gran cantidad de errores en IE. La librería está disponible en dos archivos, IE7.JS e IE8.JS (En IE7.JS encontramos una gran cantidad de arreglos a fallos de IE7, mientras que el resto de mejoras están incluidas en IE8.JS. … Lee más!
Elegante barra de navegación usando CSS
¿Necesitas una barra de navegación para tu sitio web? Este tutorial explica como diseñar una bonita barra de navegación mediante el uso de CSS, inspirada en Gettyimages. Es tan simple como otras que he descrito anteriormente, además de poder encontrar mayor inspiración en esta lista de menús horizontales. dtsv.dtse_post_3952_permalink = ‘http://www.cssblog.es/elegante-barra-de-navegacion-usando-css/’; dtsv.dtse_post_3952_title = ‘Elegante barra … Lee más!
Gráfica de compatibilidad de navegadores con WebKit
Los navegadores basados en Webkit cada vez van siendo más compatibles, pero aún falta bastante para que todos tengan el mismo índice de compatibilidad. Desde Ajaxian nos muestran una gráfica comparativa de compatibilidad de todos los navegadores que utilizan como motor de renderizado a WebKit. Safari 4.0 está en primer lugar (94%), seguido por la … Lee más!
Eliminar el contorno de puntos en Firefox con CSS
Todo el que use Firefox 3 se dará cuenta que al hacer click sobre un enlace o un elemento enlazado con la etiqueta <a> este crea un recuadro punteado alrededor de sí mismo. En Firefox 3, el color de los puntos está determinado por el color del texto, en anteriores versiones y en otros navegadores … Lee más!
Tooltip oculto con CSS
Los bocadillos de texto (tooltip) son un recurso muy interesante a la hora de mostrar textos informativos. En esta entrada aprenderemos a crearlos usando HTML, CSS y 3 imágenes. Estos bloques de información quedarán ocultos y únicamente se mostrarán al mover el ratón encima de un enlace. dtsv.dtse_post_3742_permalink = ‘http://www.cssblog.es/tooltip-oculto-css/’; dtsv.dtse_post_3742_title = ‘Tooltip oculto con … Lee más!
5 bonitas estructuras de encabezados
En esta entrada os mostraré 5 ejemplos sobre encabezados, esa parte tan importante que aparece al comienzo de un texto. También la entrada sobre tipografías adecuadas para encabezados puede resultaros útil. Generalmente los encabezados contienen 5 elementos: 1- Título del artículo 2- Fecha de publicación 3- Nombre del autor 4- Categoría o etiquetas 5- Número … Lee más!
Eliminar el borde de las imágenes con vínculo
Cuando vinculamos una imagen, si no tenemos aplicada la propiedad border: none; alrededor de la imagen podremos identificar un recuadro azul, si usamos Firefox. Como decía anteriormente, con solo aplicar la propiedad anterior con su valor correspondiente esto se arreglará y el borde quedará eliminado. Esto es muy sencillo pero existe gente que tiene el … Lee más!
Forzar la barra de desplazamiento vertical con CSS
Alguna vez puede que deseemos mostrar la barra vertical de un bloque (texto, imágenes) de forma forzada. Ocultar la barra de navegación puede ser útil en el caso de tener contenido que no rebase el contenedor, pero si la siguiente página del sitio web es larga y requiere una barra de navegación o si usas … Lee más!
Selector de productos estilo Apple con CSS & JQuery
Si deseamos crear un catálogo en nuestro sitio, podemos hacerlo con este selector de productos realizado con CSS y JQuery que os voy a mostrar a continuación. El selector está inspirado en el que Apple utiliza para sus productos. Lo primero que debemos hacer es descargar este set de efectos JQuery UI. Por supuesto tenemos … Lee más!
