Está en la página 1de 17

1.

HTML BÁSICO:

Se han usado etiquetas como h1 para el título y p para párrafos.

Usamos distintos headings, cuanto más pequeño es el número que acompaña a la “h”, más pequeño es el título.

1
El tag “P” define los párrafos.

Los links de html se definen con el tag “<a>”, se puede enlazar a un texto

2
Con el tag img podemos pegar una imagen, también usamos src para el destino de archivo y width y height le da
forma

2.FORMATO HTML:

La <b> pone el texto en negrita, <i> en italic, <sub> en subscript y <sup> en superscript.

3
Aquí vemos como actúa la <b>, que pone los textos en negrita

<strong> sirve para textos importantes los cuales resalta

<i> pone texto en italic

4
<em> pone texto enfatizado, también dice que un screen reader lo leerá con más énfasis.

<small> hace que el texto sea más pequeño

<mark> subraya un texto

5
<del> tacha el texto

<ins> subraya un texto

<sub> pone texto en subíndice

6
<sup> pone texto en superíndice

3.ENLACES HTML:

<a> define un hipervínculo, y con <href> indicamos el destino del texto con enlace

Si el target=_"blank", el link se abrirá en una nueva ventana.

7
Los links locales son especificados con una url relativa

Poniendo el tag <img> dentro de <a> conseguimos que la imagen enlace al link especificado.

8
Para crear un link que se abre en el email del usuario, usa mailto: dentro del atributo href

Para poner un botón que te redirecciona al hacer click en él a un link, tenemos que poner código JavaScript:
<button onclick="document.location='default.asp'">HTML Tutorial</button>

El atributo "title" especifica información extra sobre un elemento. La información normalmente es mostrada
como un texto tooltip cuando el ratón esta encima del elemento.

9
Este ejemplo usa un URL entero para enlazar una web

En este ejemplo podemos ver como enlazar a una página localizada en la carpeta html de la web

En este ejemplo enlazamos a una página cuyo archivo se encuentra en la misma web

4.IMAGENES HTML:

Hemos introducido una imagen poniendo su link, y hemos definido sus medidas

10
El atributo alt debería reflejar el contenido de la imagen para que los usuarios que no puedan verla, entiendan lo
que contiene.

Aquí podemos ver como cambiarle el ancho y alto a la imagen con <style>

11
En la primera imagen usa el atributo "width", pero el style en la sección de Head está por encima, y pone el width
a 100%, en cambio, en la segunda imagen usamos el atributo "style", por lo que no manda sobre el style en el
Head.

Solemos guardar imagenes en una sub-carpeta. Por lo que tendremos que incluir el nombre del archivo en el
atributo src.

12
Especificamos la url entera ya que la imagen es de otra web

Podemos también incluir gifs

13
Usando float podemos hacer que la imagen “flote” a la izquierda o derecha.

5.TABLAS HTML:

14
En esta tabla hemos cambiado la anchura de los bordes y lo que había dentro de las celdas.

Todo lo que hay entre td y /td está dentro de las celdas

15
Con <TR> y </TR> definimos las filas

16
Con th definimos las cabeceras de la tabla

17

También podría gustarte