Outbook

HTML+CSS+JS, Accesibilidad, PHP y más

Datos de búsqueda

HTML 5: Secuencia de encabezados y elementos estructurales

Elemento FOOTER

El elemento FOOTER representa un pie para su elemento de sección ascendiente más próximo, y contiene información acerca del contenido de la sección: autor, enlaces relacionados, copyright, etc. También puede contener información de contacto mediante el elemento ADDRESS.

Si su elemento superior de sección es el elemento BODY, el contenido del elemento FOOTER estará referido a todo el documento.

El elemento FOOTER no constituye sección: Si contuviera elementos que si sean de sección, éstos serán considerados como anexos al contenido principal y no como parte de dicho contenido.

No tiene que aparecer necesariamente al final de la sección, aunque es lo recomendable.

Saber más: footer – footer (enlace externo, en inglés).

Ejemplos

Para el habitual enlace de vuelta a la página anterior que se muestra al principio o al final del contenido puede utilizarse el elemento FOOTER dos veces:

<body>
[...]
<footer><a href="#">Volver</a></footer>
<article>  
  [...]
  <p>[Contenido del documento]</p>
</article>
<footer><a href="#">Volver</a></footer>
</body>

Ejemplo de uso de FOOTER duplicado

Ejemplo con dos elementos FOOTER, uno dentro del elemento ARTICLE y otro para todo el documento:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>The Ramblings of a Scientist</title>
</head>
<body>

<header>
  <h1>The Ramblings of a Scientist</h1>
</header>

<article>
  <header>
    <h1>Episode 15</h1>
  </header>
  <p>[Contenido del artículo]</p>
  <footer><!-- Pie para elemento ARTICLE -->
    <p>Published <time pubdate="" datetime="2009-10-21T18:26-07:00"></time></p>
  </footer>
</article>

<footer><!-- Pie para todo el documento -->
  <nav>
    <ul>
      <li><a href="#">Credits</a></li>
      <li><a href="#">Terms of Service</a></li>
      <li><a href="#">Blog Index</a></li>
    </ul>
  </nav>
  <p>Copyright © 2009 Gordon Freeman</p>
</footer>

</body>
</html>

Ejemplo de uso de FOOTER

Compartir este artículo:

  • Compartir en del.icio.us
  • Compartir en Technorati
  • Añadir a Google Bookmarks
  • Compartir en Google Buzz

Datos del artículo:

Comentarios de la página

Puedes comentar o hacer trackback desde tu propio sitio web.

Si el comentario no guarda relación con el tema del artículo o los comentarios previos, si la redacción del mismo es ilegible (estilo HOYGAN), o si contiene insultos u otros términos ofensivos, será borrado de inmediato. No se garantiza ningún soporte a los ejemplos de desarrollo web presentados en este sitio.

Todavía no hay comentarios.

Hacer un comentario