Estructura del lenguaje HTML
- Entidades
- Comentarios
- Atributos globales
- Elementos de bloque
- Elementos de linea
- Etiquetas para marcar nombres
- Etiquetas de maquetación
Entidades
Las entidades (named-characters) nos permiten representar algunos
caracteres que para el navegador tienen un significado distinto porque
forman parte del lenguaje html. Las entidades se escriben empezando por el
carácter & y terminando en ;
Entidades
| Carácter | Entidad |
|---|
| & | & |
| espacio | |
| < | < |
| > | > |
| " | " |
| © | © |
| ' | ' |
Comentarios
Los elementos que llamamos comentarios no tienen ningún efecto sobre la
página (no se muestran). Su único objetivo es facilitar la labor de los
desarrolladores web cuando estos consulten el código de la página,
añadiendo las explicaciones oportunas en los distintos elementos.
Para incluirlos en nuestro documento html se hace entre los siguientes
símbolos <!-- -->
<!-- Aquí iría el comentario
que puede ocupar una o varias líneas -->
Atributos globales
Llamamos atributos globales a aquellos atributos que podemos incluir en cualquier etiqueta.
| Atributo | Descripcion |
|---|
| id | Nombre con el que identificamos el elemento de forma única en
el documento (es decir, el nombre que le pongamos no se puede
repetir en ningún otro elemento. |
| style | Permite asignar estilos (css) a un elemento. |
| class | Permite identificar varios elementos como pertenecientes a un
mismo grupo (clase) para posteriormente aplicar a todos ellos los
mismos estilos. |
| lang | Especifica el idioma del contenido del elemento |
| title | Información extra del elemento (tooltip). |
| contenteditable | Si existe, el contenido del elemento es editable |
| hidden | Si existe, el elemento no se representa
|
Otros atributos globales son: accesskey, tabindex, draggable, spellcheck,
translate y dir. Además de estos atributos, existen los atributos de eventos:
onclick, onmouseover, ondoubleclick, onchange, onfocus, ...
Elementos de bloque que no hemos visto
Hemos utilizado las siguientes:
<h1> ... <h6> <p> <hr>
<ol> <ul> <li> <dl>
<dd> <dt> <table> <tr>
<td> <br>
- <address>
- Sirve para incluir información de contacto. Ejemplo:
Puedes contactar con el profesor en su dirección:
Calle Malaspenas nºXX
3700x Salamanca
- <blockquote>
- Se utiliza para añadir una sección que se cita de otro texto o
documento (es una "cita larga", que ocupa varias líneas). Se suele
acompañar del atributo cite que contiene la referencia a la fuente de la
cita. Ejemplo:
Ya nos explicó Cervantes como deberíamos comportarnos:
No comas ajos ni cebollas, porque no saquen por el olor
tu villanería. Anda despacio; habla con resposo; pero no
de manera que parezca que te escuchas a ti mismo; que
toda afectación es mala. Come poco y cena más poco;
que la salud de todo el cuerpo se fragua en la oficina del
estómago. Sé templado en el beber, considerando que el
vino demasiado ni guarda secreto, ni cumple palabra. Ten
cuenta, Sancho, de no mascar a dos carrillos, ni de erutar
delante de nadie.
- <details>
- Sirve para poner contenido que sólo se hace visible si pulsamos sobre
él. Se suele acompañar de la etiqueta < summary > que incluye el
contenido visible (de no ponerse esta etiqueta, nos aparecerá la
palabra detalles. Ejemplo:
Pincha aquí si eres curioso
- <dialog>
- Sirve para mostrar una caja de diálogo. Se usa junto con el atributo
open que indica que la caja es visible (su utilidad radica en
combinarla con javascript para ocultarla o hacerla visible en un
determinado momento). Ejemplo:
Muestra caja Oculta caja