Curso de HTML

Prof.
Ramiro Chuquimia
ramirochuquimia@gmail.com
CURSO DE HTML
HTML
Hiper Text Markup Language
Lenguaje Marcado de Hiper Texto
“Marcado”  que utiliza


marcasz también
llamadas etiquetasz
ETIQUETA
 < nombre etiqueta >

z Se utilizan los símbolos “<“ menor y
“>“ mayor para encerrar los nombres
de las diferentes etiquetas.
 Existen 2 tipos de etiquetas
z Etiquetas llenas ( completas)
 Etiquetas vacías (incompletas)

ETIQUETAS LLENAS
1. Se escribe la etiqueta de apertura
2. Seguida del texto o elemento al que
vamos a aplicar la etiqueta.

3. Se termina repitiendo la instrucción
pero con una barra inclinada dentro de

la etiqueta.

Por ejemplo, el elemento H1 (sirve para dar el

máximo tamaño al texto)
 <H1> Texto de prueba </H1>

ETIQUETAS VACIAS
1. Se escribe la etiqueta de apertura
2. El texto a continuación
3. No es necesario cerrar la etiqueta:
z no producen un efecto sobre el texto

 Generalmente se utilizan para separar
bloques de texto
 Empiezan y terminan en el mismo punto.
 Por ejemplo, el elemento BR (sirve para dibujar un

salto de línea)
 <BR>
ATRIBUTOS DE LAS ETIQUETAS
 Las etiquetas, además de su nombre
pueden contener diferentes
“atributos” los cuales modifican o
complementan el comportamiento de
una determinada etiqueta.
 Por ej.
 <font color=“blue”> texto color azul
</font>
ATRIBUTOS DE LAS ETIQUETAS
 Unamisma etiqueta, puede contener
diferentes tipos de atributos, los
cuales agregaran cambios a los
elementos que encierran.
AMBITO DE UNA ETIQUETA
 Solo las etiquetas “completas” tiene
ambito, el cual se refiere al contenido
que se encuentra entre la etiqueta de
apertura y la etiqueta de cierre.
 Por Ej.
 <font color=“red”>
 este es mi texto dentro del font <br>
 <h3> texto modificado con h3</h3>
 </font>

AMBTIO DE LAS ETIQUETAS
 Como pudimos apreciar en el ejemplo
anterior, una etiqueta también puede
contener a mas etiquetas dentro de su
ámbito.
 El efecto o cambio que realice la
etiqueta “superior” también se
aplicará a las etiquetas que encierre.
ESTRUCTURA DE UNA PAGINA HTML
 <HTML>
< HTML >
 <HEAD>
< HEAD > ca b e ce ra
 </HEAD>
< / HEAD >
 <BODY>
< BODY >


cu e rp o

 < / BODY >

</BODY>
< / HTML >
</HTML>
CABECERA <HEAD>
 Encierra información acerca del
documento, y su contenido no es
visible en la pagina Web.
 Existen dos etiquetas de HTML
principales:
z <TITLE>
z Título de la página que aparecerá en los
navegadores.
 Los buscadores lo utilizan para clasificar las
páginas.
 <META>
 Sirve para incluir información sobre:
z el autor de la página,
 nombre del editor de HTML,
CUERPO <BODY>
 Dentro de la etiqueta body,
introducimos todo el contenido que va
a ser visto por el usuario al ingresar a
la pagina web.
 <BODY>
 este es el contenido visible en la
pagina web
 </BODY>

ETIQUETAS DE FORMATO
Tamaño de Texto
 Las etiquetas que nos permiten
modificar el tamaño de texto son:
 <H1> Texto de prueba (H1)</H1>.
 <H2> Texto de prueba (H2)</H2>

Tamaño de Texto
z Además de las etiquetas H1, H2, …, H6 podemos
modificar el tamaño del texto con la etiqueta
<FONT> mediante su atributo size.
< font SIZE=3>A</font>
< font SIZE=3>A</ font >

Tipos de Letras
 Podemos modificar el tipo de letra de
nuestro texto en HTML con la
propiedad “face” de la etiqueta
<FONT>
 <FONT FACE=“tipo de
letra”></FONT>
 Ej.
 <FONT face=“Arial”> Texto de tipo de letra
Arial</Arial>
COLOR
 Podemos modificar el color de nuestro
Texto mediante la propiedad “color”
de nuestra etiqueta <FONT>
 Ej.
 <FONT color=“green”> texto color verde
</FONT>
EL COLOR EN LA WEB
 Los colores además de ser escritos por
su nombre en ingles, pueden estar
escritos mediante un # (numeral)
seguido de 6 digitos.
 A esta notación se la conoce como
notación Hexadecimal.
 Ej.
z #000000 sin color
 #00ff00 verde
 #ff0000 rojo
 #0000ff azul

BLOQUES DE TEXTO
 Podemos separar diferentes bloques de
texto mediante las etiquetas:
 <p> mi parrafo </p>
 <div> mi parrafo </div>
 </span> mi parrafo </div>

TABLAS
Definición
 Las tablas son grupos de datos unidos
mediante una estructura que les
brinda una posición definida.

fila
co lu m n
a
TABLAS
z Para crear las tablas usamos la etiqueta
<TABLE>, la cual es una etiqueta
completa.
 Para crear las filas usamos la etiqueta
<tr>.
 Para crear columnas usamos la etiqueta
<td>
 Tanto <tr> y <td> son etiquetas
completas.
 El atributo border permite definir un

Curso de HTML

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Curso de HTML

Transféré par

Droits d'auteur :

Formats disponibles

Prof.

“Marcado”  que utiliza

 < nombre etiqueta >

vamos a aplicar la etiqueta.

pero con una barra inclinada dentro de

Por ejemplo, el elemento H1 (sirve para dar el

3. No es necesario cerrar la etiqueta:

z no producen un efecto sobre el texto

 Por ejemplo, el elemento BR (sirve para dibujar un

 < / BODY >

< font SIZE=4>A</font>

< font SIZE=5>A</font>

< font SIZE=6>A</font>

< font SIZE=7>A</font>

< font SIZE=6>A</font>

< font SIZE=5>A</font>

< font SIZE=4>A</font>

< font SIZE=3>A</ font >

 <div> mi parrafo </div>

 </span> mi parrafo </div>

Vous aimerez peut-être aussi