Autor Tema: Ejercicio CU00717B curso HTML desde cero. Hipervínculos texto, imagen y tooltip  (Leído 3528 veces)

borri_10

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 31
    • Ver Perfil
Código: [Seleccionar]
<html>
<head>
<meta charset="utf-8">
<title> Animales de Africa </title>
</head>
</body>
<h1> " Animales de Africa" </h1>
<h2>" Leones" </h2>
<pre>
El león (Panthera leo) es un mamífero carnívoro de la familia de los félidos y una de las 5 especies del género Panthera.
Algunos machos, excepcionalmente grandes, llegan a pesar hasta 250 kg,3 lo que los convierte en el segundo félido viviente más grande después del tigre.
Los leones salvajes viven en África subsahariana y Asia, con una población en peligro crítico al noroeste de la India,
habiendo desaparecido del norte de África, de Oriente Próximo y del oeste de Asia en tiempos históricos.
<a href="http://es.wikipedia.org/wiki/Panthera_leo" target="_blank"> Pulsa aqui para saber más sobre los leones"</a>
</pre>
<h2> " Tigres" </h2>
<pre>
El tigre (Panthera tigris) es una de las cuatro especies de la subfamilia de los panterinos (familia Felidae) pertenecientes al género Panthera.
Se encuentra solamente en el continente asiático; es un predador carnívoro y es la especie de felino más grande del mundo,
4 pudiendo alcanzar un tamaño comparable al de los felinos fósiles de mayor tamaño.
<a href=" http://es.wikipedia.org/wiki/Panthera_tigris"> <img src="http://www.knickers.it/il%20tuo%20web/Sfondi/tigre.jpg" width="300px" target="_blank" title=" Pulsa aqui para saber mas sobre tigres"></a>
</pre>
<a id="Inicio"></a>
En esta pagina puedes ir a <a href="#Primero"> Inicio</a>, a <a href="#Segundo"> Leones</a> o a <a href="#Tercero"> Tigres</a>.
<a id=" Primero ">< Inicio ></a>
<a id=" Segundo ">< Leones ></a>
<a id=" Tercero ">< Tigres ></a>
Volver <a href="#Inicio">Inicio</a>
</body>
</html>

Se que por lo menos la parte de abajo no está bien, pero necesito que me la corrijáis para decirme como se hace bien.

Saludos,
« Última modificación: 01 de Enero 2015, 15:49 por Alex Rodríguez »

Alex Rodríguez

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2050
    • Ver Perfil
Crea un documento HTML que conste de las siguientes partes. Un encabezado H1 donde indicaremos “Animales de Africa” como texto a mostrar. -- > CORRECTO

Un encabezado H2 donde indicaremos “Leones” como texto. -- > CORRECTO

Dentro de este apartado incluiremos varios párrafos que hablarán sobre los leones -- > NO ES CORRECTO, aquí se refiere a que crees varias etiquetas <p> ... </p> que son los párrafos en html, tú has usado una etiqueta <pre>

y un enlace externo (link) de tipo texto cuyo texto será: “Pulsa aquí para saber más sobre leones” y que llevará con un target blank a la siguiente dirección web de wikipedia: http://es.wikipedia.org/wiki/Panthera_leo -- > CORRECTO

Un encabezado H2 donde indicaremos “Tigres” como texto. --> cORRECTO

Dentro de este apartado incluiremos varios párrafos que hablarán sobre los tigres -- > NO ES CORRECTO, aquí se refiere a que crees varias etiquetas <p> ... </p> que son los párrafos en html, tú has usado una etiqueta <pre>


y una imagen que debe mostrar como tooltip “Pulsa aquí para saber más sobre tigres”.
-- > CORRECTO

Al pulsar sobre la imagen se llevará al usuario a un target blank dirigido a la dirección web http://es.wikipedia.org/wiki/Panthera_tigris
-- > CORRECTO

En la parte inferior incluiremos tres links internos (para lo que tendremos que haber definido las anclas correspondientes) que indicarán: “Ir al inicio – Ir a leones – Ir a tigres (Según el link que pulse el usuario, se le llevará al inicio, al encabezado del apartado de leones o al encabezado del apartado de tigres).
-- > NO ES CORRECTO, tienes que poner el ancla en el sitio adonde quieres llegar, y después el link donde quieras para que te lleve a donde esté el ancla.

Este código sería un ejemplo de solución (he introducido muchos saltos de línea con <br/> para que se pueda ver el efecto de desplazarnos dentro de la página, si no hay suficiente espacio parece como si no se moviera de un ancla a otra.

Código: [Seleccionar]

<html>
<head>
<meta charset="utf-8">
<title> Animales de Africa </title>
</head>
</body>
<a id="Inicio"></a>
<h1> " Animales de Africa" </h1>
<a id="Leones"></a>
<h2>" Leones" </h2>
<p>El león (Panthera leo) es un mamífero carnívoro de la familia de los félidos y una de las 5 especies del género Panthera.</p>
<p>Algunos machos, excepcionalmente grandes, llegan a pesar hasta 250 kg,3 lo que los convierte en el segundo félido viviente más grande después del tigre.</p>
<p>Los leones salvajes viven en África subsahariana y Asia, con una población en peligro crítico al noroeste de la India,
habiendo desaparecido del norte de África, de Oriente Próximo y del oeste de Asia en tiempos históricos.</p>
<p><a href="http://es.wikipedia.org/wiki/Panthera_leo" target="_blank"> Pulsa aqui para saber más sobre los leones"</a></p>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a id="Tigres"></a>
<h2> " Tigres" </h2>
<p>El tigre (Panthera tigris) es una de las cuatro especies de la subfamilia de los panterinos (familia Felidae) pertenecientes al género Panthera.</p>
<p>Se encuentra solamente en el continente asiático; es un predador carnívoro y es la especie de felino más grande del mundo,
4 pudiendo alcanzar un tamaño comparable al de los felinos fósiles de mayor tamaño.</p>
<a href=" http://es.wikipedia.org/wiki/Panthera_tigris"> <img src="http://www.knickers.it/il%20tuo%20web/Sfondi/tigre.jpg" width="300px" target="_blank" title=" Pulsa aqui para saber mas sobre tigres"></a>

<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<p>En esta pagina puedes ir a <a href="#Inicio"> Inicio</a>, a <a href="#Leones"> Leones</a> o a <a href="#Tigres"> Tigres</a>.</p>
</body>
</html>

Saludos

Asderel

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 1
    • Ver Perfil
Saludos Alex Rodríguez, en el ejercicio también se pedía que al hacer clic en la imagen esta se abriera en otra pestaña. El target="_blank" lo pusiste en la imagen y no en el <a> por lo que no se abre.

Saludos.

Alex Rodríguez

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2050
    • Ver Perfil
Tienes razón, la línea debe quedar así:

Código: [Seleccionar]
<a href=" http://es.wikipedia.org/wiki/Panthera_tigris" target="_blank"> <img src="http://www.knickers.it/il%20tuo%20web/Sfondi/tigre.jpg" width="300px"  title=" Pulsa aqui para saber mas sobre tigres"></a>

Gracias por el apunte!

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".