Listado de los capítulos

Listado de los capítulos

Qué es CSSComenzamos presentando las Hojas de Estilo en Cascada y explicando de qué manera ayudan a los diseñadores de páginas web.

1.- Introducción a las CSS

Una breve introducción a CSS, para las personas que no saben nada sobre la tecnología el por qué de su creación y cómo ayuda a hacer páginas web mejores.

2.- Características y ventajas de las CSS

Conoce las principales características del lenguaje, su potencia y sus posibilidades.

Distintas maneras de incluir estilosExisten distintas formas de definir estilos en una página, a diversos niveles que van desde las más específicas, que permitirían definir estilos en un pequeño texto de una página, hasta las más generales, para definir estilos para toda una página o incluso un sitio web.

3.- Usos de las CSS I

Describimos las distintas aplicaciones de las Hojas de Estilo en cascada. En este capítulo veremos las más sencillas.

4.- Usos de las CSS y II

Te describimos los usos más avanzados de las hojas de estilo en cascada. Para poder utilizarlas de la manera más potente.

5.- Otra manera de definir estilos en un archivo externo

También podemos incluir estilos en un archivo externo con un código con la sintaxis @import url("estilo.css"). Se utiliza para definir estilos comunes cuando hay también definición de estilos específicos.

lenguaje CSSDistintos apartados que tienen que ver directamente con el lenguaje utilizado para definir los estilos en páginas web, el CSS. Veremos su sintaxis, los diferentes atributos o reglas de estilo que podemos aplicar a los elementos y cómo seleccionar conjuntos de elementos de la página para aplicarles estilo agrupados o por separado.

6.- Sintaxis y unidades CSS

En este capítulo explicamos la sintaxis CSS, de hojas de estilo en cascada, con especial atención a las unidades CSS.

7.- Notación de colores CSS

Varias maneras, sintaxis o notaciones para definir colores con CSS de los elementos de la página.

8.- Atributos de las hojas de estilo

Explicación y ejemplos de los distintos atributos de las CSS. Podrás encontrar la lista en una tabla para imprimirtela y trabajar fácilmente.

9.- Definición de estilos CSS Shorthand

Disminuye el peso de tus hojas de estilo utilizando la forma shorthand de especificación CSS, que no es más que una manera reducida de escribir las propiedades de estilos.

10.- Pseudo-element en CSS (pseudo elementos)

Vamos a conocer los pseudo elementos en CSS, hojas de estilo en cascada, que sirven, entre otras cosas, para definir estilos para la primera línea o letra de un texto.

11.- Trucos avanzados con CSS

Vamos a ver una serie de técnicas con hojas de estilo, imprescindibles para utilizar esta tecnología con toda su potencia.

Modelo de cajaEn CSS se crea un nuevo modelo de caja que nos sirve para agrupar elementos en contenedores, a los que luego podremos aplicar estilos con CSS. Se trata de las capas, o cajas, que cobrarán una gran importancia a la hora de realizar tus diseños.

12.- Qué son las capas

Vemos las diferencias entre varias etiquetas para aplicar estilos y crear capas y una pequeña introducción a las capas.

13.- Atributos para capas

Veamos el posicionamiento de capas y otros atributos que podemos utilizar al definirlas.

14.- Problema con el posicionamiento absoluto de capas

A veces el posicionamiento absoluto de capas es demasiado rígido, pues si la definición de pantalla cambia de un usuario a otro las capas pueden quedar colocadas en lugares donde no deseamos. He aquí una solución.

15.- El Modelo de Caja en CSS

Un aspecto especialmente relevante de CSS es el Modelo de Caja. Este artículo brinda una primera aproximación a su arquitectura y a las distintas posibilidades que ofrece.

16.- Problemas del Modelo de Caja en Internet Explorer 5

Si no se toman ciertos recaudos nuestros diseños se verán distinto en distintos navegadores y aún peor: en distintas versiones del mismo navegador. Este artículo analiza esos comportamientos anómalos y brinda algunos trucos para que nuestros diseños

17.- Por qué diseñar con CSS

Mostramos algunas ventajas al maquetar con CSS respecto a otras formas de hacerlo.

Posicionamiento CSS y maquetaciónA partir de la implantación de CSS el estándar se volvió la herramienta indicada para la maquetación de las páginas web. En los próximos artículos hablaremos sobre el posicionamiento de elementos en la página y sobre la maquetación de los contenidos atendiendo a cualquier distribución que el diseñador necesite.

18.- Maquetación CSS

Una introducción sobre cómo maquetar una página utilizando capas, que ilustra el funcionamiento y la potencia de las CSS con ejemplos.

19.- Formas de aplicar estilos en maquetación CSS

Repaso a los métodos por los que se pueden aplicar estilos a las páginas web mediante CSS.

20.- Flujo HTML y atributos CSS

El flujo HTML es el modo en el que se van colocando los componentes de la página, a partir de cómo aparecen en el código HTML y los atributos CSS de los elementos.

21.- Posicionamiento CSS

Las hojas de estilo en cascada incorporan múltiples formas para posicionar elementos en la página, lo que comúnmente se conoce como posicionamiento CSS.

22.- Tipos de posicionamiento con el atributo position de CSS

Explicamos los distintos valores que puede tener el atributo position de CSS, con detalle.

23.- EL atributo Overflow de CSS

Explicamos esta propiedad interesante contemplada en la especificación CSS 2.

Trucos y consejos avanzados sobre CSSAlgunos trucos y consejos fundamentales que debemos conocer si deseamos realizar un uso de CSS medianamente avanzado.

24.- Trucos CSS para no enloquecer

Algunas soluciones a los problemas tipicos que te puedes encontrar con CSS.

25.- Lo que nadie te contó de la propiedad z-index

Analizamos la propiedad CSS z-index para intentar descifrar su correcto uso más allá del habitual conocimiento que tenemos de ella, normalmente consistente en saber que las capas con mayor valor de z-index se colocan delante de las de valor menor.

26.- Utilizar porcentajes para tamaños de texto con CSS

El tamaño del texto se puede cambiar por medio de CSS, para agrandarlo o disminuirlo, por medio de porcentajes, de modo que el nuevo tamaño sea relativo al tamaño actual.

27.- CSS semánticas. Un nuevo enfoque

Existen infinidad de sitios en Internet que ofrecen miles de propuestas diferentes a la hora del uso de hojas de estilo CSS en la maquetación de portales web, como sabemos aplicables a múltiples tecnologías: XHTML, Flash, etc…

28.- CSS semánticas. Un nuevo enfoque (II)

Este artículo es la continuación de CSS semánticas. Un nuevo enfoque, y trata de dar una serie de consejos o recomendaciones a la hora del uso de hojas de estilo y escritura de código XHTML.

29.- 10 errores comunes en los css

Esta es una recopilación de errores comunes en las hojas de estilo. Es bastante provechoso hacer una lista con estos y otros errores comunes.

30.- Reglas de estilo CSS de usuario y de autor

Veamos qué son las reglas de estilo de usuario, configuradas opcionalmente por cada usuario en su navegador, y las reglas de estilo de autor, que define el desarrollador de cada web.

31.- Declaración !important en CSS

En CSS podemos declarar reglas de estilos como !important para que tomen precedencia sobre otras reglas de estilos que se puedan encontrar en una página web.

32.- Regla @media de CSS

Explicamos la regla @media permite definir estilos CSS específicos para distintos medios en los que se pueda mostrar una página web.

33.- Depurar CSS

Una lista de los errores más comunes en el código CSS y cómo averiguar cuál de esos errores se está produciendo en tu código, para depurar tus CSS.

Por dónde continuarAhora que ya sabes bastante sobre CSS, quizás quieras abrir nuevos horizontes y para ello te damos algunas referencias para continuar aprendiendo.

34.- Listado de distintos frameworks CSS

Un listado de los frameworks CSS que hay en el mercado para ayudar en la maquetación de páginas web con CSS.

35.- Frameworks CSS: Ventajas e inconvenientes

Ventajas e inconvenientes del uso de Frameworks CSS, Discutimos acerca de la conveniencia o no de usar frameworks CSS.

36.- Introducción a CSS 3

CSS 3 trae grandes novedades para el diseño de webs y algunos navegadores comienzan a implementar CSS 3.

37.- Unidades CSS viewportwidth y viewportheight

Nuevas unidades de CSS3: viewportwidth y viewportheight. Cómo podemos hacer un útil uso de ellas al aplicarlas a tamaños de las tipografías.

38.- Modelo de tabla CSS con la propiedad display

Posibilidades del modelo de tabla en CSS con display table, table-row, table-cell y muchas otras. Explicaciones y ejemplos.

39.- Arquitectura CSS: problemas

Proponemos contemplar CSS como si fuera un lenguaje de programación, analizando algunas de las inofensivas costumbres, que resultan no serlo tanto.

40.- Arquitectura CSS – Soluciones

Después de ver en el artículo “Arquitectura CSS – Problemas” los problemas de código y las consecuencias que podemos tener por tenerlos, es hora de darte algunos consejos para mejorar.