Tecnología

Inicio

Cómo hacer una Cartera fotográfico con HTML

Cómo hacer una Cartera fotográfico con HTML


Si usted es un fotógrafo y tener un sitio web considere hacer una página de la cartera fotográfica para que pueda obtener la exposición máxima para su trabajo. Esta colección de imágenes muestra a los visitantes sus imágenes pasadas y presentes y da a la gente la posibilidad de ver sus talentos. HyperText Markup Language (HTML) le ofrece la posibilidad de mostrar sus imágenes en la Web. Utilice el software de editor de texto para introducir el código HTML que hace que una cartera de fotografía básica.

Instrucciones

1 Ingrese a su cuenta de alojamiento web. Sube los archivos de imagen que esté mostrando en su cartera fotográfica en la misma carpeta que contiene el archivo de índice principal de su sitio.

2 Inicie el software de editor de texto y crear una nueva página o abrir un documento existente en la que desea crear su portafolio fotográfico. Coloque el cursor después de la apertura <body>. Si su editor no proporciona automáticamente el código HTML básico de páginas, introduzca lo siguiente:
<Html>
<Head>
</ Head>
<Body>
</ Body>
</ Html>

3 Tipo "<h1> </ h1>" etiquetas e introduzca su nombre entre estos elementos como este:
<H1> Su nombre </ h1>

4 Enter "<div style =" "> </ div>" elementos y coloque el cursor entre las comillas del atributo de estilo. Tipo "float: left;" para alinear su cartera para el lado izquierdo de la página y permitir a sus imágenes para mostrar en filas horizontales. Además, introduzca "padding:" y escriba un valor numérico en píxeles para determinar la cantidad de espacio entre cada imagen aparece. Para ilustrar:
<Div style = "float: left; padding: 5px;">
</ Div>

5 Tipo "<img src =" "alt =" "/>" entre las etiquetas div e introduzca su nombre de archivo de imagen después de que el atributo src y una descripción de su foto después de que el atributo alt. Repita este proceso para mostrar tantas imágenes como desee. Por ejemplo:
<Img src = "photo1.jpg" alt = "Descripción de la foto 1" />
<Img src = "photo2.jpg" alt = "Descripción de la foto 2" />
<Img src = "photo3.jpg" alt = "Descripción de la foto 3" />

6 Guarde el archivo. Su código HTML completa ahora se ve como este ejemplo:
<Html>
<Head>
</ Head>
<Body>
<Div style = "float: left; padding: 5px;">
<Img src = "photo1.jpg" alt = "Descripción de la foto 1" />
<Img src = "photo2.jpg" alt = "Descripción de la foto 2" />
<Img src = "photo3.jpg" alt = "Descripción de la foto 3" />
</ Div>
</ Body>
</ Html>

7 Vista previa de su trabajo en un navegador Web. Cuando esté listo, subir el documento a su anfitrión para publicar la cartera.