H T M L Tema 2 Formatos, Listas Y Tablas

HTML Tema 2: Formatos, listas y tablas

Diapositiva resumen ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Espacios, tabuladores, … ,[object Object],[object Object], Ejercicio 2.1

Texto preformateado - <pre> ,[object Object], Ejercicio 2.2

Atributos title y align ,[object Object],[object Object]

Elementos en línea o en bloque ,[object Object],[object Object]

Bloques de texto - <div> y <span> ,[object Object],[object Object],[object Object],<center> Texto centrado</center> equivale a <div align=“center”> Texto centrado</div>  Ejercicio 2.3

Párrafos y saltos de línea – <p> y <br> ,[object Object],[object Object], Ejercicio 2.4

Elementos para títulos o cabeceras ,[object Object],[object Object], Inicio Ejercicio 2.5

Texto estructurado – Elementos de frase (I) – <em>, <strong>, … ,[object Object],[object Object],[object Object]

Texto estructurado – Elementos de frase (II)

Texto estructurado – Elementos de frase (y III) Valor del atributo título al pasar el ratón  Continúa Ejercicio 2.5

Citas - <BLOCKQUOTE> y <Q> ,[object Object],[object Object], Continúa Ejercicio 2.5

Subíndices, superíndices y direcciones - <sub>, <sup> y <address> ,[object Object],[object Object],[object Object], Fin Ejercicio 2.5

Elementos <Font> y <BaseFont> ,[object Object],[object Object], Inicio Ejercicio 2.6 Valor entero entre 1 y 7, por defecto es el 3. Si ponemos + o – delante es incremento con respecto a la base (establecida con basefont) Tamaño size Lista de nombres de fuentes separados por comas. El navegador mostrará la primera que conozca Fuente face Ver diapositiva de color Color color Valores Descripción Atributo

Elementos de estilo de fuente - <tt>, <i>, <b>, … <strong>, <em>, … indican cómo interpretar el texto (más importante, menos, etc), mientras que <b>, <i>, .. Indican cómo representarlo  en la práctica la mayoría de los navegadores representan <strong> igual que <b> (negrita) y <em> igual que <i> (cursiva)  Continúa Ejercicio 2.6 Texto subrayado <u> Tamaño de texto menor <small> Tamaño de texto mayor <big> Como de máquina de escribir (ancho fijo) <tt> Texto en negrita <b> Texto en itálica (cursiva) <i> Ejemplo Descripción Elemento

Elemento separador - <hr> ,[object Object],[object Object], Fin Ejercicio 2.6 Ancho de la barra en píxeles o en tanto por ciento Tamaño (ancho) width center (valor por defecto), left (izquierda) o right (derecha) Alineación align Alto de la barra en píxeles. Tamaño (alto) size No tiene valor Sin sombra noshade Valores Descripción Atributo

Listas (I) Ordenadas Desordenadas De definición

Listas (y II) - atributos para las listas ordenadas <ol> y desordenadas <ul> ,[object Object],[object Object], Ejercicio 2.7 No tiene valor Modo compacto compact <OL>  1 (1, 2, 3,…), a (a, b, c, …), A (A, B, C, …), i (i, ii, iii,….), I (I, II, III,…) <UL>  disc (disco), square (cuadrado), circle (círculo) Tipo del objeto type Es el número del elemento. Solo se aplica a <li> Valor value Es el número de comienzo de la lista, por defecto es 1. Sólo se aplica a <ol> Valor inicial start Valores Descripción Atributo

Tablas - Introducción ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],El tamaño especificado a la tabla es respetado por los navegadores siempre que quepa el contenido, si no, se redimensiona de forma automática.

Tablas – Atributos de <table> (I) Width, cellpadding y cellspacing pueden ser: pixeles (p.e. 3) o porcentaje del espacio libre (p.e. 40%) Align  alineación de la tabla no de su contenido Vista en Internet Explorer Vista en Mozilla Firefox

Tablas – Atributos de <table> (II)

Tablas – Atributos de <table> (y III) Vista en Internet Explorer Vista en Internet Explorer

Tablas – Atributos de <caption> Vista en Mozilla Firefox

Tablas – Atributos de filas <tr> Vista en Mozilla Firefox Estos atributos afectan a todas las celdas de la fila

Tablas – Atributos de celdas <th> y <td> Vista en Mozilla Firefox Width y height pueden ser: pixeles (p.e. 30) o porcentaje del espacio libre (p.e. 40%) Nowrap  deshabilita el ajuste automático de línea, es decir, no divide una línea en varias Colspan, rowspan  combinación de celdas  Ejercicios 2.8 - 2.11

Fin Tema 2 – Formatos, listas y tablas Volver al índice

H T M L Tema 2 Formatos, Listas Y Tablas

Recomendados

Recomendados

Más contenido relacionado

Destacado

Destacado (19)

Similar a H T M L Tema 2 Formatos, Listas Y Tablas

Similar a H T M L Tema 2 Formatos, Listas Y Tablas (20)

Último

Último (20)

H T M L Tema 2 Formatos, Listas Y Tablas

Notas del editor