CSS

Por defecto la etiqueta hr tiene 1px de borde por sus 4 lados. Si queremos que la línea sea fina, basta con quitar el borde, fijar en pixeles la altura y el color que queramos por medio de background-color. En […]

Leer más...

Rotar texto en css

Estilo para rotar texto u otro elemento en css, usando la propiedad «transform» rotate con los prefijos de los de navegadores web más populares (Safari, Firefox, Opera, IE9+): .rotar { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }

Leer más...

La propiedad de css «z-index» se utiliza para determinar el nivel o capa en la que se muestra un elemento. El valor de z-index debe ser un número entero, y su valor máximo vienen determinado por la variable que el […]

Leer más...

A continuación un listado de las @media queries más comunes de CSS3 para hacer responsive web desing: adaptar vuestras páginas web a los diferentes dispositivos móviles (Smartphones, iPads, iPhones) en sus diferentes posiciones portrait (vertical) and landscape (horizontal): /* Smartphones […]

Leer más...

Podemos dar una determinada opacidad de color a un background utilizando el formato RGBa de CSS3, que es compatible con los navegadores modernos (chrome, firefox 3+, safari 3+, Opera 10+, IE9). En el siguiente ejemplo vamos a dar una opacidad […]

Leer más...

Tener un iframe con un 100% de altura es realmente sencillo. A continuación el código css de ejemplo para que el iframe ocupe el 100% de alto: html, body, iframe { margin:0; padding:0; height:100%; } iframe { display:block; width:100%; border:none; […]

Leer más...

Código css para forzar al navegador web a imprimir una/s determina página en escala de grises. Lo que hay que hacer realmente es aplicar un filtro css al body del documento para convertir todos los elementos en escala de grises, […]

Leer más...

Ocultar texto en CSS

Hay varios métodos o técnicas para ocultar textos utilizando css. A continuación 3 ejemplos de los métodos que más he utilizado. 1. display:none Es el más sencillo pero también más agresivo para los buscadores, ya que detectan a primera vista […]

Leer más...

Responsive Design

En español sería algo así como: «diseño web adaptable” o «diseño web flexible«. Esta actualmente muy de moda en la web, y consiste en adaptar fácilmente el diseño de una web a los diferentes dispositivos que usamos para visitarla, como […]

Leer más...