CÓMO HACER UNA PRESENTACIÓN AL COMPLETO, PASO A PASO

En esta parte, seguiremos enseñando las herramientas que tenemos y su repercusión en el modo HTML.

Para ello, miramos la siguiente herramienta que es la de crear un enlace .

Para los que no sepan lo que es un enlace:
Un enlace es lo que se denomina "link". Es una palabra en la que se puede hacer click y la que te lleva a otro sitio (otra página, una imagen...)

Esta herramienta es útil si queremos por ejemplo que esa palabra nos conduzca a la ficha de un caballo que tenemos en venta, a algún foro en concreto, a una imagen que queremos enseñar...

Por ejemplo, si en mi presentación quiero poner un link que conduzca a este tema:

- Escribo la palabra/frase en la que se hará click.



- Copiar la dirección que aparece en el navegador y a la que conducirá el link.



- Seleccionar la palabra/frase.



- Hacer click en el icono



- Pegar ahí la dirección y aceptar.




Seguido, vemos que la palabra/frase se ha quedado subrayada (en la presentación no se verá) eso significa que el link ha sido creado.

Si guardamos la presentación y pasamos el ratón por encima, vemos que el cursor cambia y se subraya la palabra/frase y si hacemos click, nos dirige a esta página.

Si entramos al modo HTML, encontramos esto:



El código de crear un enlace ya lo tenemos.
Por lo tanto, ya sabemos cómo hacer para que una palabra o frase sea un enlace.

Juntando este código con los aprendidos en la Parte III, podemos ver:



Cuando hay varios comandos en un código, se ponen dentro del mismo, separados con un simple espacio.
style="xxx" href="xxx"


-La siguiente herramienta es la de insertar una imagen

Esta herramienta es sencilla, ya que conociendo la dirección de la imagen, sólo es hacer click sobre el icono y pegar ahí la dirección.

Por ejemplo, vamos a poner una imagen de bienvenida: https://2img.net/h/oi47.tinypic.com/2hd1ctx.jpg

Hacemos click sobre el icono



- Pegar ahí la dirección y aceptar




- Si la imagen que hemos seleccionado es demasiado grande, siempre podemos reducirla a nuestro antojo.

Para ello vamos al modo HTML y miramos los códigos.



Como vemos, el código de una imagen no tiene cierre.
Y por la información que tenemos ahí, no sabemos cómo modificarle el tamaño.
Para ello, agregaremos lo que ya hemos aprendido anteriormente.



Donde width es la anchura y height es la altura.

Así, nos quedará la imagen más ajustada según la queramos.




- Una herramienta que no aparece pero que podemos utilizar con los conocimientos hasta ahora adquiridos, es hacer que una imagen funcione como enlace.

Esta opción sólo se puede hacer en el modo HTML.

Lo primero, hay que localizar la imagen que queramos hacer de enlace en el modo HTML.



Como ya sabemos el código de los enlaces y cómo funciona, sólo tenemos que aplicarlo:



En este caso, he elegido la imagen de un Xanthos y el enlace al tema de las caricias de Xanthos en Acontecimientos.

Una cosa nueva que aparece es target="_blank" que se utiliza para que el enlace conduzca a una ventana o pestaña diferente, ya que sin esa adición, el enlace se abriría en la ventana de la presentación.


- La última herramienta de este grupo es la de línea horizontal

Si hacemos click en ella, aparecerá una línea que abarca toda la anchura de la presentación y que no se puede seleccionar, tan sólo eliminar.
Si vamos al modo HTML vemos su código y sus posibles modificaciones.



Podemos sacar la conclusión de que width: 100% hace referencia al porcentaje de anchura que queremos que abarque dicha línea. Si ponemos 50%, sólo cubrirá la mitad.
height: 2px hace referencia a la altura o grosor de la línea. Por defecto viene 2 px pero se puede cambiar a nuestro gusto.

Si utilizamos nuestra técnica que hemos aprendido, podemos ponerle un color como si tuviese un fondo que rellenar que por defecto viene transparente: