Puedes utilizar un iframe o marco para mostrar una página web en el interior de una página web.
Sintaxis
La sintaxis básica para añadir iframes o marcos es:
<iframe src="URL"></iframe>
El atributo src especifica la URL (dirección web) de la página que se va a mostrar en el iframe o marco.
Indicar la altura y anchura
Debes utilizar los atributos height y width para indicar respectivamente la altura y anchura del iframe.
Los valores de estos atributos se especifican, por defecto en pixels, aunque puedes indicarlos también como porcentaje (80% por ejemplo).
Ejemplo
<!DOCTYPE html> <html> <body> <iframe src="demo_iframe.htm" width="200" height="200"></iframe> </body> </html>
Resultado en el navegador
Eliminar el borde
Por defecto, cuando se inserta un iframe en un página web, este se muestra rodeado por un borde negro. Para eliminar el borde, tendrás que utilizar el atributo style junto a la propiedad border de CSS.
Ejemplo
<!DOCTYPE HTML> <html> <body> <iframe src="demo_iframe.htm" style="border:none"></iframe> </body> </html>
Resultado en el navegador
Utilizando CSS podrás cambiar el tamaño, estilo y color del borde del iframe.
Ejemplo
<!DOCTYPE HTML> <html> <body> <iframe src="demo_iframe.htm" style="border:5px dotted red"></iframe> </body> </html>
Resultado en el navegador
Usar un iframe como destino de un link
También puedes utilizar un iframe para que al hacer clic sobre un link o enlace se muestre, en un marco, la página web a la que hace referencia. Para ello, el atributo target del link o enlace debe de coincidir con el atributo name del iframe.
Ejemplo
<!DOCTYPE HTML> <html> <body> <iframe width="100%" height="300px" src="demo_iframe.htm" name="iframe_a"></iframe> <a href="http://www.un.org/es/index.html" target="iframe_a"><b>Haz clic aquí</b></a> para ver la página de <strong>Naciones Unidas</strong> en el marco superior. </body> </html>
Resultado en el navegador
Haz clic aquí para ver la página de Naciones Unidas en el marco superior.