desde una palabraH1 es el titulo de mayor jerarquia.
Las etiquetas de titulos son una H y un numero, que indica le jerarquia. Tienen etiqueta de inicio y de fin
Es de mal estilo no seguir la jerarquia. Debajo del nivel 1 va el 2 u otro 1, por ej.
El titulo anterior es de jerarquia 2, segundo nivel
Los parrafos van con la etiqueta p, de inicio y fin.
El texto preformateado es un texto que va a aparecer tal cual lo escribo. La etiqueta es pre, de inicio y fin
Este texto
esta
escrito
en
varias
lineas
preformateadas
Este texto esta formato en varias lineas con parrafo
Las lineas tienen etiqueta de lista de inicio y fin, y, entremedias, los elementos de la lista o list items (li)
Son listas con viñetas o imagenes. La etiqueta de inicio y fin es ul (unordered list)
Los elementos de la lista no ordenada van entre etiquetas li
Listas concatenadas:
La etiqueta de inicio y fin es dl (definition list)
Hay dos elementos en las listas de definicion
Las listas se pueden concatenar:
Las imagenes SOLO tienen etiqueta de inicio, omg, pero siempre tienen parametros. Hay varios parametros oblogatorios:
Los enlaces usan la etiqueta a. Tienen etiqueta de inicio y fin, y siempre enlazan desde algun sitio:palabra, imagen...
Se enlaza a una URL o una direccion relativa en tu sitio web.
Voy a enlazar la pagina de Googledesde una palabra
Voy a enlazar la pagina de desde una palabra
Voy a enlazar la pagina de Drogas y adolescentesdesde una imagen
Se trata de hacer hiperenlaces en partes de una imagen. Previamente hay que hacer el "mapa de imagenes", hacer formas sobre la imagen que es desde donde se van a hacer los hiperenlaces
La etiqueta para el mapa de imagenes es map. Hay etiqueta de inicio y de fin. Tiene un atributo que es name.
Entre las etiquetas de inicio y fin de map estableces las areas, con la etiqueta area. Tiene atributos parecidos a los hiperenlaces y a la imagen. El atributo mas importante es shape, que indica la forma. Tambien hay que especificar las coordenadas. Y los atributos alt y href.
Existe tambien una etiqueta para indicar que en una imagen quiero usar un mapa de imagenes. Es la etiqueta usemap. Se usa con el nombre del mapa, dentro de la etiqueta img: usemap=#NombreMapa
con un hiperenlace podemos enviar un correo. La diferencia esta en que en el href ponemos mailto:
Contacto
Las tablas tienen 3 tipos de etiquetas obligatorias
Las palabras se dibujan por filas y solo puede haber contenido dentro de las celdas
Todas las filas tienen que tener el mismo numero de celdas, pero se pueden cambiar celdas de filas y columnas
A1 |
B1 |
C1 |
A2 |
B2 |
C2 |
Por defecto las tablas se dibujan sin bordes. Para que salgan bordes lo tienes que poner en la hoja de estilos. Vamos a crear una clase, tabla, en la hoja de estilos (las clases enpiezan con un punto), y se nombran como un parametro de table en la pagine web.
Al igual que en excel o calc, se pueden unir varias celdas en una. Podemos unir varias celdas de una misma fila (fácil), o, unir varias celdas de la misma columna (mas difícil y más fácil equivocarse. Hay que eliminar las celdas que sobran.
La unión de celdas se hace con un parámetro dentro de la etiqueta de celda, TD.
El parámetro colspan indica que hay varias celdas unidas en una fila, lo que implica que una celda engloba varias columnas. Por ej. colspan=2 indica que hay dos celdas unidas. Vamos a probar con nuestra tabla.
| A1 | C1 | |
| A2 | B2 | C2 |
Vamos a probar englobando las tres primeras celdas:
| A1 | ||
| A2 | B2 | C2 |
El parámetro rowspan indica que hay varias celdas unidas en una columna, lo que implica que una celda engloba varias filas. Por ej. rowspan=2 indica que hay dos celdas unidas. Vamos a probar con nuestra tabla.
| A1 | B1 | C1 |
| B2 | C2 |
Ahora haced una tabla de 4 columnas y 6 filas. Las 4 celdas de la primera fila tienen que estar unidas. Y las celdas segunda a sexta de la primera columna tienen que estar unidas.
| A1 | |||
| A2 | B2 | C2 | D2 |
| B3 | C3 | D3 | |
| B4 | C4 | D4 | |
| B5 | C5 | D5 | |
| B6 | C6 | D6 | |