Curso de css

CSS (Cascading Style Sheets) es una sintaxis sencilla, estandarizada, que proporciona a los diseñadores un amplio control sobre la presentación de sus páginas Web. De este modo, CSS representa ya un componente esencial del diseño Web en la actualidad. Este libro está dirigido a diseñadores y desarrolladores Web que se enfrentan a los problemas de diseñar con CSS para solucionar los entresijos comunes asociados a este trabajo. El curso le proporciona cientos de ejemplos detallados con este código que puede utilizar inmediatamente, así como material de gran valor en esta materia, incluidos tópicos que van desde la tipografía Web básica y diseño de página a técnicas para formatear listas, formularios y tablas.Introducción Audiencia Suposiciones que hace este libro Contenido de este libro Convenciones utilizadas en este libro Código fuente Capítulo 1. General Introducción Utilizar CSS con HTML Problema Solución Explicación Utilizar diferentes selectores para aplicar estilos Problema Solución Explicación Selectores de tipo Selectores de clase Selectores ID Selectores descendientes Selectores hijo Selectores universales Selectores hermano adyacentes Selectores atributo Pseudo-clases Pseudo-elementos Determinar cuándo utilizar clases y selectores ID Problema Solución Explicación Entender las propiedades CSS Problema Solución Explicación Entender el modelo caja Problema Solución Explicación Entender DOCTYPES y efectos en diseño de navegador Problema Solución Explicación Asociar estilos a una página Web Problema Solución Explicación Cuándo utilizar estilos en línea Cuándo utilizar hojas de estilo internas Cómo utilizar diferentes tipos de hojas de estilo Problema Solución Explicación Añadir comentarios dentro de CSS Problema Solución Explicación Organizar los contenidos de una hoja de estilo Problema Solución Explicación Organizar archivos de hoja de estilo Problema Solución Explicación Trabajar con propiedades abreviadas Problema Solución Explicación Establecer una hoja de estilo alternativa Problema Solución Explicación Utilizar flotantes con imágenes Problema Solución Explicación Utilizar posicionamiento absoluto Problema Solución Explicación Utilizar posicionamiento relativo Problema Solución Explicación Utilizar CSS en Adobe Dreamweaver Problema Solución Explicación Utilizar CSS en Microsoft Expression Web Designer Problema Solución Explicación Capítulo 2. Tipografía Web Introducción Especificar fuentes Problema Solución Explicación Especificar medidas y tamaños de fuente Problema Solución Explicación Unidades de longitud Unidades relativas Establecer el tamaño de fuentes en cero o un valor negativo Adquirir más control sobre el tamaño de fuente Problema Solución Explicación Utilizar píxeles Accesibilidad y tipografía Web Utilizar palabras clave de fuente Utilizar unidades em para controlar el tipo de letra Forzar los tamaños de fuente Problema Solución Explicación Centrar texto Problema Solución Explicación Configurar texto para que esté justificado Problema Solución Explicación Eliminar espacio entre encabezados y párrafos Problema Solución Explicación Establecer una sencilla mayúscula inicial Problema Solución Explicación Establecer una mayúscula inicial centrada y más grande Problema Solución Explicación Establecer una mayúscula inicial con decoración (imagen) Problema Solución Explicación Crear un encabezado con texto con estilo Problema Solución Explicación Crear un encabezado con texto con estilo y bordes Problema Solución Explicación Aplicar estilo a un encabezado con texto y una imagen Problema Solución Explicación Crear una cita con texto HTML Problema Solución Explicación Crear una cita con bordes Problema Solución Explicación Crear citas con imágenes Problema Solución Explicación Establecer la sangría en la primera línea de un párrafo Problema Solución Explicación Establecer la sangría de párrafos enteros Problema Solución Explicación Crear una sangría colgante Problema Solución Explicación Sangrías colgantes seguras La sangría colgante emparejada Aplicar estilo a la primera línea de un párrafo Problema Solución Explicación Aplicar estilo a la primera línea de un párrafo con una imagen Problema Solución Explicación Crear un efecto de texto resaltado Problema Solución Explicación Cambiar el espaciado de línea Problema Solución Explicación Añadir un tratamiento gráfico a texto HTML Problema Solución Explicación Situar sombra detrás del texto Problema Solución Explicación Ajustar el espaciado entre letras y palabras Problema Solución Explicación Capítulo 3. Imágenes Introducción Poner un borde alrededor de una imagen Problema Solución Explicación Eliminar bordes establecidos en imágenes de forma predeterminada en algunos navegadores Problema Solución Explicación Establecer una imagen de fondo Problema Solución Explicación Crear una línea de imágenes de fondo Problema Solución Situar una imagen de fondo en una página Web Problema Solución Explicación Utilizar múltiples imágenes de fondo en un selector Problema Solución Explicación Crear una imagen de fondo fija Problema Solución Explicación Superponer texto HTML en una imagen Problema Solución Explicación Reemplazar texto HTML con una imagen Problema Solución Explicación Origen del método de sustitución de imagen Problema con el método FIR El método de sustitución de imagen Phark Enfoque CSS 3 de sustitución de imagen Reemplazar texto HTML con texto Flash Problema Solución Explicación Utilizar múltiples imágenes PNG con transparencia Problema Solución Explicación Crear una presentación panorámica de imagen Problema Solución Explicación Combinar diferentes formatos de imagen Problema Solución Explicación Redondear esquinas con columnas de ancho fijo Problema Solución Explicación Redondear esquinas (técnica de puertas corredizas) Problema Solución Explicación Esquinas redondeadas (técnica de esquinas en escalera) Problema Solución Explicación Redondear esquinas con JavaScript Problema Solución Explicación Colores diferentes Tamaños diferentes Elementos diferentes Esquinas específicas Situar una sombra detrás de una imagen Solución Explicación Situar una sombra suavizada detrás de una imagen Problema Solución Explicación Hacer escalables las imágenes Problema Solución Explicación Crear bocadillos de diálogo Problema Solución Explicación Impedir que la gente robe sus imágenes Problema Solución Explicación Barra de herramientas Imagen de Microsoft Ninguna imagen está segura Insertar reflejos en imágenes automáticamente Problema Solución Explicación Características de personalización Problemas conocidos de navegador Utilizar representaciones digitales de imagen Problema Solución Explicación Capítulo 4. Elementos de página Introducción Eliminar márgenes de página Problema Solución Explicación Colorear la barra de desplazamiento Problema Solución Explicación Técnicas para centrar elementos en una página Web Problema Solución Explicación Tablas Imágenes Centrado vertical Colocar un borde de página Problema Solución Explicación Personalizar una regla horizontal Problema Solución Explicación Añadir el script lightbox Problema Solución Explicación Configurar los archivos Crear una presentación de diapositivas Pro