viernes, 8 de marzo de 2013

Programación HTML Básica



Conceptos Básicos

Los documentos HTML están formados por etiquetas, que son las diferentes instrucciones que podemos darle al documento.

Las etiquetas tienen una apertura y un cierre.


Ejemplo:

                <H1>TITULO DE MI WEB</H1>


Podemos crear un documento HTML utilizando el BLOG DE NOTAS de Windows, guardando el documento con extensión .HTML



Partes de un documento HTML


1. LA CABECERA <HEAD>

La HEAD es la primera de las dos partes en que se estructura un documento HTML.

En la HEAD reside información acerca de la página.

Dentro del  HEAD pueden utilizarse otros elementos como TITLE que muestra el titulo del documento en el navegador.

Ejemplo:

<HTML>

<HEAD>

<TITLE>web asistencia</TITLE>

</HEAD>

</HTML>



2. EL CUERPO <BODY>

Es donde reside el verdadero contenido de la página.


La etiqueta BODY cuenta con algunos atributos que se refieren  a todo el contenido de la página:

  • BACKGROUND="url o imagen.jpg":

Definirá la imagen que se utilizará de fondo de la pagina.

  • BGCOLOR=#rrvvaa ó nombre color:

 Indicará el color del fondo de la página.

  • TEXT=#rrvvaa ó nombre del color:

Especifica el color del texto normal dentro de la página.

Por defecto será negro.

  • LINK=#rrvvaa ó nombre del color:

Indica el color que tendrán los enlaces que no han sido usados.

Por defecto será azul.

  • VLINK=#rrvvaa ó nombre del color:

Color de los enlaces que ya han sido visitados.

Por defecto es un color azul más oscuro.

Ejemplo:

<html>

                <head>

                               <title>web asistencia</title>

                </head>



                <body background=foto.jpg  text=blue>

                                <p>Este es el cuerpo de la pagina</p>

                </body>

</html>




ETIQUETAS DE TEXTO



TITULOS

Del  <H1> al <H6>

Pone un texto el tamaño de titulo

               

<h3>Texto de prueba</H3>



PARRAFOS

<P> y <DIV>.

Ambas aceptan el atributo Align para alinear el texto



<div align=center>hola mundo</div>



Align puede ser =Center, right, left y justify



LETRA

<Font>

Admite los siguientes atributos:

·         Size: tamaño de letra

·         Color: color de letra

·         Face: tipo de fuente

Ejemplo

                <Font color=red size=”7” face=”arial”>Hola mundo</Font>



NUMERACIONES




Viñetas:
<ul>
<li>Tomates
<li>Zanahorias
<li>Puerros
</ul>
  • Tomates
  • Zanahorias
  • Puerros
Numeración:
<ol>
<li>Tomates
<li>Zanahorias
<li>Puerros
</ol>
1.       Tomates
2.       Zanahorias
3.       Puerros


ETIQUETAS DE ENLACES

Podemos crear enlaces a otras web u otras partes de nuestra página

Para ello utilizaremos la etiqueta <a> con el atributo href.



Ejemplo

<a href=”http://www.google.es/”>google</a>



ETIQUETAS DE IMÁGENES

Para colocar imágenes utilizamos la etiqueta <IMG> con el atributo src:

Ejemplo

<img src=foto.jpg>

<img src=https://www.google.es/images/srpr/logo4w.png>



Otros atributos de <IMG>



·         WIDTH=ancho de la imagen en pixeles

·         HEIGHT=alto de la imagen en pixeles



Ejemplo



<img src=foto.jpg WIDTH=272 HEIGHT=92>


1 comentario: