En esta semana se retoma el tema de las tablas HTML, para mostrar cómo pueden expandirse en renglones y columnas. También se proporciona una introducción a la estructura de un archivo CSS, con sus selectores, atributos y valores; y se revisan algunos atributos CSS para manejo del fondo de una página web, tales como: background-color, background-image, background-repeat, background-position, background-attachment, entre otras. Finalmente, se muestra cómo se manejan los atributos de los divs para posicionamiento y tamaño.
Los objetivos que deben cumplirse al final de esta semana son los siguientes:
Presentación. Diapositivas con Tablas con Expansión. En esta presentación se proporciona una introducción y ejemplos de tablas HTML con expansión de renglones y columnas, utilizando los atributos rowspan y colspan. |
|
Ejemplo de clase. Tablas con expansión. En este ejemplo, el profesor crea una página web estática, para ilustrar el uso de las tablas con expansión de renglones y columnas, utilizando los atributos rowspan y colspan. |
|
SOLUCIÓN del Ejemplo de clase. Tablas con expansión. Archivo ZIP con los archivos para la solución del ejercicio de clase, los cuales incluyen: tablaExpansion.html con la estructura de la página web creada. |
|
SOLUCIÓN del Ejemplo de clase. Tablas con expansión. En este link se abre una pestaña nueva con la solución del ejemplo de clase. |
|
Presentación. Diapositivas con una introducción a CSS. En esta presentación se proporciona una introducción a la estructura de un archivo CSS, con sus selectores, atributos y valores. Además se revisan algunos atributos CSS para manejo del fondo de una página web, tales como: background-color, background-image, background-repeat, background-position, background-attachment, entre otras. |
|
Ejemplos de clase. Imágenes con CSS. Archivo ZIP con varios ejercicios acerca de manejo de imágenes con CSS. Contiene los siguientes ejercicios: ejemplo00_backgroundColor.html, ejemplo01_backgroundColor.html, ejemplo01_backgroundImage_perro.html, ejemplo02_backgroundImage.html, ejemplo02_backgroundImage_perro_norepeat.html, ejemplo03_backgroundImage.html, ejemplo03_backgroundImage_perro_repeatx.html, ejemplo04_backgroundImage_cielo_repeatx.html, y ejemplo05_backgroundImage_position.html. |
|
Ejemplo de clase. Manejo de DIVs. En este ejemplo, el profesor crea una página web estática, para ilustrar el manejo de DIVs, y los atributos para la posición y tamaño de DIVs. |
|
SOLUCIÓN del Ejemplo de clase. Manejo de DIVs. Archivo ZIP con los archivos para la solución del ejercicio de clase, los cuales incluyen: divs.html con la estructura de la página web creada, y divsEstilos.css con los estilos para el posicionamiento y tamaño de los Divs. |
|
SOLUCIÓN del Ejemplo de clase. Manejo de DIVs. En este link se abre una pestaña nueva con la solución del ejemplo de clase. |
|