Etiquetas importantes para HTML5

Etiquetas importantes para HTML5

Material complementario de autoestudio

Etiquetas HTML de texto

Sintaxis en HTML

Los elementos HTML se escriben con los símbolos < >. La mayor parte requieren

una etiqueta de cierre, que se escribe con /.

• Ejemplo: <etiqueta></etiqueta>.

• Ejemplo con etiqueta de párrafo: <p></p>

¿Cómo las podemos escribir?

Las etiquetas HTML se pueden escribir indistintamente en mayúsculas o minúsculas, aunque lo habitual es escribirlas en minúsculas.

El navegador ignora las tabulaciones y saltos de página, por lo que podemos emplearlos para dar formato a nuestro código.

Podemos introducir comentarios en nuestro código (o comentar parte del código y que no se muestre en el navegador) agrupándolo entre la apertura de comentario:

<!—— y el cierre de comentario: ——>

Etiquetas de Texto:

• <p></p>

  Marca un párrafo.

• <br>

  Marca un salto de línea. No requiere de cierre.

• <h1></h1>

  Marca un encabezado de primer nivel. Solo puede haber uno por página.

• <h2></h2>

  Marca un encabezado de segundo nivel.

Etiquetas de Texto:

• <h3></h3>

  Marca un encabezado de tercer nivel.

• <h4></h4>

  Marca un encabezado de cuarto nivel.

• <h5></h5>

  Marca un encabezado de quinto nivel.

• <h6></h6>

  Marca un encabezado de sexto nivel.

Etiquetas de Texto:

• <em></em>

  Etiqueta semántica para hacer énfasis en una palabra en particular. Normalmente se renderiza como una cursiva.

• <strong></strong>

  Etiqueta semántica para indicar la relevancia en un texto de una palabra en particular.

  Normalmente se renderiza como una negrita.

• <span></span>

  Etiqueta sin valor semántico que sirve para acotar trozos de texto.

Atributos para las etiquetas HTML

Sintaxis

Los atributos

Los atributos se escriben en la etiqueta de apertura de un elemento, después del nombre. Se pueden escribir varios atributos separados por espacios. La forma de asignar un valor a un atributo es con el símbolo = y el valor entre comillas. No puede haber espacios entre el atributo y el =, o entre el = y las comillas.

• class=" "

  Asigna una o más clases a un elemento html. Si hay más de una clase, se separan con espacios.

• id=" "

  Asigna un identificador único a un elemento html. Un elemento no puede tener más de un id, y no puede haber dos elementos con el mismo id.

Etiquetas HTML de imágenes y enlaces

Rutas de archivo

Rutas de archivo

Cuando hacemos referencia a un archivo (imagen, enlace…), ponemos el nombre del archivo (con la extensión si la tiene) y la carpeta o carpetas en las que pueda estar respecto al HTML desde el que se le llama, separadas por / . Si se debe subir uno o varios niveles de carpetas para acceder al archivo, se indica con dos puntos.

Ejemplo: ../../imagenes/elemento.gif

Etiqueta de imagen

<img src=" " alt=" ">

Etiqueta de imagen. El atributo src indica la ruta del archivo, y el alt es el texto alternativo.

Etiqueta de enlace

<a href=" "></a>

Etiqueta de enlace. El atributo href indica la página de destino. Puede ser a un archivo dentro del propio dominio, o a otro dominio (si es a otro, hay que poner la URL completa, con http://).

Un enlace puede ser a una sección de la misma página, marcada con un id. En ese caso, el href empezará con # y el valor del id.

Para abrir un enlace en una ventana nueva, añadiremos el atributo

target=˝_blank˝ .