10 | Enlazar vs. incrustar [código HTML]

<table align="center" border="1" style="background-color: #bbccee; width: 600px;"><tbody>
<tr>
<td><div style="text-align: center;">
En este post revisar el código HTML para deducir cómo se logra enlazar otra página desde el blog. Además, es importante saber el modo en el que se embebe un vídeo (u otro objeto de información) en base a su código HTML. </div>
</td></tr>
</tbody></table>

<div id="AnclaEnlazar"> </div>
<br />
<h3>Enlazar</h3>

Esto <a href="https://youtu.be/w_DKWlrA24k" target="_blank">es un enlace</a> que abre la nueva página en otra pestaña. Veamos cómo se edita un enlace. En la siguiente imagen, se muestran varios enlaces y para conseguirlos:
<ol>
  <li>Escribimos el literal y una vez escrito...</li>
  <li>...con el ratón o el teclado seleccionamos el texto del literal y</li>
  <li>mediante el icono de insertar enlace pegamos la URL de destino</li>
</ol>

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto;"><tbody>
  <tr>
    <td style="border: 1px solid grey;"><a href="http://blogbasicoparapracticarhtml.blogspot.com/2018/01/simbolos-especiales.html" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="227" data-original-width="671" height="135" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUeyhqaBmMrt6f_xYVYL5RFpdVMwWbRkY1hwdvKMbZ7y5EkQxLIhpgPUWz-mAaFFYqYrkCfDU6LO5dpiknDZk_MMfbiRroEWBQ0URJaXfgvyeAozMK7m5RspI3Wl4cNHV4XoIooOvAN2I/w400-h135/InsertarEnlaces.png" width="400" /></a></td>
  </tr>
  <tr><td class="tr-caption" style="text-align: center;"><i>Imagen de una página de este mismo blog</i><br /></td>
  </tr>
</tbody></table>

<div id="AnclaIncrustar"> </div>

<p>De la misma manera que podemos hacer que un texto sea un enlace, es decir que apunte a cierta página web. Podemos hacer que una imagen sea también un enlace.</p>

<p>Para el caso de que la portadora del enlace sea una imagen los pasos siguen siendo tres:</p>

<ol style="text-align: left;">
  <li>Introducimos la imagen en el blog</li>
  <li>Con el ratón o el teclado seleccionamos la imagen y</li>
  <li>Pulsamos sobre el icono de insertar enlace y pegamos la URL de destino</li>
</ol>

<p>&nbsp;</p>

<h3>Inscrustar</h3>

Y aquí se ha embebido un vídeo en la propia página:
<br />
<div style="text-align: center;">
<iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/w_DKWlrA24k" width="560"></iframe>
</div>

<br />
Y aquí se ha embebido un visor para mostrar en archivo PDF:

<br />
<iframe height="600" src="https://drive.google.com/file/d/0B01U8fE2Z-bsd0gwMFI3djJfNjg/preview" width="640"></iframe>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>