Cómo crear una página HTML
Etiquetas de la estructura: Antes de comenzar a agregar objetos a nuestra pagina es necesario crear la estructura básica de la siguiente manera:
- <!DOCTYPE html><html><head><title></title></head><body></body></html>
Añadir objetos: Una vez creada la estructura podemos comenzar a agregar los objetos que deseamos, para el ejemplo agregaremos un texto y le pondremos un formato de titulo:
<!DOCTYPE html>
<html>
<head>
<title>Este es el titulo de la pagina</title>
</head>
<body>
<h1>Texto de prueba</h1>
<p>Este es un ejemplo de creación de una pagina web</p>
</body>
</html>
Guardar el archivo: Una vez agregados los objetos debemos guardar el archivo con la extensio .html, para ello daremos clic en archivo > guardar como:
En el nombre del archivo escribiremos al final .HTML
Y este seria el resultado que se mostraría en el navegador:
Luego de esto podemos agregar mas objetos a nuestra pagina y personalizarla a nuestro gusto:
Primero podemos cambiar el color de fondo de nuestra pagina, para ello se agrega la propiedad BGCOLOR en la etiqueta <BODY>, de la siguiente forma:
El color que deseamos debemos agregarlo con un codigo de color para HTML, para conocer los codigos de los colores que desees dar Clic aqui
Para Guardar los cambios y verlos en el navegador damos clic archivo > guardar
El resultado en el navegador seria el siguiente:
Otro objeto que podemos agregar serian las imágenes que agregaremos de la siguiente forma:
Para agregar objetos debemos ubicarlos dentro de la etiqueta <BODY> </BODY> y escribir el siguiente código:
<img src="C:\Users\Murillo\Desktop\ImagenPrueba.jpg">
- img es la etiqueta para agregar imagenes en html
- src es la propiedad que nos indica el nombre y direccion donde se almacena la image, asi como el tipo de imagen.
- widt nos permite modificar el ancho de la imagen.
- height nos permite cambiar el el alto de la imagen.
Una vez guardados los cambio se mostraría de la siguiente manera:
Para poder colocar nuetsra imagen en el centro de la pagina vamos a colcarla dentro de una area para aplicarle la propiedad de alineacion, en nuestro ejemplo lo colocaremos dentro de un parrafo:
<p align="center">
<img src="C:\Users\Murillo\Desktop\ImagenPrueba.jpg" widt="300" height="199">
y al dar clic sobe el enlace:
