Las etiquetas vienen en dos variedades: a nivel de bloque de elementos, que marca grandes secciones o bloques, en su documento, y en línea de elementos, que son los pequeños trozos, por lo general contienen una sola línea.
El navegador web pone nuevas líneas (creo Enter
en el
teclado) alrededor de los elementos a nivel de bloque para que aparezcan en
su propia línea.
La Siguente fuente:
<p>p elemento </p><div>div elemento </div> <section>section elemento</section> <b>b elemento </b><i>i element </i> <span>span elemento </span><code>code elemento </code>
Representa la siguiente manera:
code element
Observe que el nivel de los elementos de bloque hacen su propia línea
(con espacio adicionales debajo de los elementos p
), mientras
que los elementos de línea son todos que estan en la misma línea.
En versiones anteriores de HTML, la distinción entre el nivel de bloque y elementos en línea era una parte firme del lenguaje HTML, junto con una regla que los elementos en línea se adjunta dentro de un elemento a nivel de bloque que sintácticamente es válida.
Con HTML 5, esta distinción es muy relajado, y es posible utilizar CSS para convertir una lista dada a cualquier nivel de bloque o en línea.
Éstos son algunos de los más comunes (y más útiles) con elementos de comportamiento por defecto a nivel de bloque:
Los siguientes elementos nuevos en HTML 5:
Éstos son algunos de los elementos en línea más comunes junto con sus usos y atributos por defecto:
Estas tres etiquetas son especiales, porque insertan objetos en lugar de
encerrar. Dado que no hay nada que contenga
, no tienen una lista de
cierre:
Puesto que <
, >
, y &
tienen un significado especial en HTML, no se pueden utilizar para
representarse a sí mismas en un documento HTML. Cuando usted desea
utilizarlos, literalmente, (como en los ejemplos de código HTML), tiene que
marcarlos con códigos especiales:
MARK-UP | RENDER |
---|---|
< | < |
> | > |
& | & |
| espacio de no separación |
El marcado de un ejemplo como este:
<h2>Uso de caracteres especiales a la fuente del marcado HTML</h2> <p> La fuente del marcado HTML requiere de caracteres especiales para reemplazar las apariciones de <, >, and &. </p>
No es bonito, pero funciona
Copia pagina_basica.html
a una página llamada
etiquetas.html
y haz lo siguiente en el nuevo documento:
Etiquetas.
<pre></pre>
etiquetas:
Este texto se extiende por varios líneas y tiene un montón de extra espacio en blanco.Describe lo que ves. A continuación, reemplace las listas <pre> con las etiquetas <p> y vuelva a recargar la página en su navegador. ¿Qué sucede?
<div></div>
y
<span></span>
en el documento. ¿Qué parece que
hay qu e hacer?