html en las canteras

h1 es el titulo de mayor jerarquìa.

tuitulos

las etiquetas de titulos son una H y un numero que indica la jerarquìa. Tienen etiqueta de inicio y de fin

es de mal estilo no seguir la jerarquìa debajo del nivel 1 va el 2 u otro 1,por ej. el tutilo anterior es de jerarquia 2, segundo nivel

titulo nivel 2

titulo nivel 3

parrafos y texto preformateado

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
       en
       varias
       lineas
       preformateado

Este texto esta en varias lineas preformateado

listas

Las listas tienen etiquetas de lista de inicio y fin y, entre medias, los elementos de la lista o list items(li)

listas no ordenadas

son listas con viñetas o imagenes. La etiqueta de inicio y de fin es ul(unordered list)

Los elementos de la lista van entre etiquetas li

• patatas
• coles
• zanahoria

las listas se pueden concatenar

• hortalizas:
  • hortalizas
  • frutas
  • legumbres
• frutas
• legumbres

listas ordenadas

los elementos de la lista orddenada van entyre elementos li.

son listas con numeros o letras. La etiqueta de inicio y de fin es ol(unordered list)

1. patatas
2. coles
3. zanahoria

las listas se pueden concatenar

• hortalizas:
  • hortalizas
  • frutas
  • legumbres
• frutas
• legumbres

listas de definicion

La etiqueta de inicio y de fin es dl(definicion list)

Hay dos elementos en las listas de definicion

• dt:definition term
• dd: definition definition

patatas:

tuberculo blanquesino

coles:

especie de lechuga rizada

imagenes

las imagenes solo tienen etiqueta de inicio pero siempre llevan parametros. Hay varios parametros obligatorios:

• indica donde esta alamacenada la imagen surce)
• alt:todas las imagenes tienen que tener un texto alternativo para las personas que no ven.
• height:altura de la imagen(px)
• width: anchura de la imgen(px)

Hiperenlaces

los enlaces usan la etiquetaa a. Tienes etiqueta de inicio y fin, y siempre enlaza desd algun sitio: una palabra, una imagen..

Enlace a otra pagina web

se enlaza a una URL o a una direccion relativa en tu sitio web. Por defecto los enlaces se muestran en azulón o subrayados

Pajina Externa --> URL

voy a enlazaar a la pajina de googledesde una palabra

voy a enlazaar a la pajina de desde una imagen.

voy a enlazaar un documento interno

voy a enlazaar un documento sobre informacion para comenzar de buena manera en el gym para adolecente o principiantesdesde una palabra.

Mapa de imagenes

Se trata de hacer hiperenlaces en partes de una imagen. previamente hay que hacer el "mapa de imagenes" hacer formas sobrre la imagen que es deonde se van a hacer los hiperenlaces

La estiqueta para mapas de imagenes es map. Hay etiqueta de inio y de fin. Tiene un atributo que es name,

entre las etiquetas de inio 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 cordenadas.

Existe tambien un atributo para indicar que en una imagen quiero usar un mapa de imagenes. Es el atrinuto usemap. se usa con el nombre del mapa, dentro de la etiqueta img: usemap=#nombre del mapa,

Enlace a un correo

Con un hiperenlace podemos enviar un correo, la diferencia esta en el href ponemos mailto:

tablas

las tablas tienen tres tipos de etiquetas obligatorias

• etiqueta de inicio y finn, table
• etiqueta de inicio y finn, tr (table row)
• etiqueta de inicio y finn, td(table data)

Las tablas se dibujan por filas y solo puede aver contenido dentros de las celdas

Todas las filas tienen que tener un numero de celdas, pero se pueden combinar celdas de filas y de columnas

hay que añadirles los marcos

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, tabla1, en la hoja de estilos (las clases empiezan con un punto), y se nombrann como un parámetro de table en la página web.

Unión de celdas en una tabla

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.

Unión de celdas de la misma fila, colspan

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.

Vamos a probar englobando las tres primeras celdas:

Unión de celdas de la misma columna, rowspan

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.

Ejemplo mixto

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.