Tutoriales de informática - Abrirllave.com

Abrirllave.com

Ejercicio de HTML - Enlaces favoritos

Crear el archivo "enlaces-favoritos.html":

Visualización del archivo enlaces-favoritos.html en Google Chrome, con enlaces a buscadores y redes sociales.

Al pinchar en el enlace "Buscadores" se debe acceder (en la misma pestaña del navegador) al archivo siguiente:

Visualización del archivo buscadores.html en Google Chrome, con enlaces a buscadores de internet.

En el documento "buscadores.html", al pinchar sobre los enlaces "Bing", "DuckDuckGo" y "Google", hay que acceder respectivamente a los siguientes sitios web en nuevas pestañas:

Y haciendo clic en el enlace "aquí", se tiene que volver a la página "enlaces-favoritos.html".

Por otra parte, al pinchar en el enlace "Redes sociales" se debe acceder (también en la misma pestaña del navegador) al archivo siguiente:

Visualización del archivo redes-sociales.html en Google Chrome, con enlaces a redes sociales de internet.

En este caso, pinchando en "Facebook", "Instagram" y "Twitter", hay que abrir nuevas pestañas a los sitios web:

Solución:

"enlaces-favoritos.html"

<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <title>Lista de enlaces favoritos</title>
  </head>
  <body>
    <h1>Enlaces favoritos</h1>
    <hr>
    <p>· <a href="buscadores.html">Buscadores</a></p>
    <p>· <a href="redes-sociales.html">Redes sociales</a></p>
  </body>
</html>

"buscadores.html"

<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <title>Enlaces a buscadores</title>
  </head>
  <body>
    <h1>Buscadores</h1>
    <hr>
    <p>· <a href="http://www.bing.com/" target="_blank">Bing</a></p>
    <p>· <a href="http://duckduckgo.com/" target="_blank">DuckDuckGo</a></p>
    <p>· <a href="http://www.google.com/" target="_blank">Google</a></p>
    <hr>
    <p>Para volver pinchar <a href="enlaces-favoritos.html">aquí</a>.</p>
  </body>
</html>

"redes-sociales.html"

<!DOCTYPE html>
<html lang="es-ES">
  <head>
    <meta charset="utf-8">
    <title>Enlaces a redes sociales</title>
  </head>
  <body>
    <h1>Redes sociales</h1>
    <hr>
    <p>· <a href="http://www.facebook.com/" target="_blank">Facebook</a></p>
    <p>· <a href="http://www.instagram.com/" target="_blank">Instagram</a></p>
    <p>· <a href="http://www.twitter.com/" target="_blank">Twitter</a></p>
    <hr>
    <p>Para volver pinchar <a href="enlaces-favoritos.html">aquí</a>.</p>
  </body>
</html>