Etiquetas básicas en html

ANDRES MAURICIO QUINTERO MACEA
Programación Web
Lic. Informática y medios audiovisuales
Facultad de educación y ciencias humanas
Universidad de Córdoba

Son códigos transparentes para el usuario, que
son interpretados por el programa del navegador,
y que controlan la manera como la información
es mostrada en la pantalla.

Las palabras encerradas entre los símbolos
menor y mayor que (< >) son las etiquetas de
HTML.

Todo archivo HTML comienza siempre con la
etiqueta <HTML> y finaliza con la etiqueta
</HTML>. La estructura de una pagina está
compuesta básicamente por dos secciones: el
encabezado (header) y el cuerpo (body),
delimitados por las etiquetas: <head>, </head> y
<body>, </body>.

El uso adecuado de la etiqueta <BODY>, que por
supuesto tiene atributos, permite entre otras
cosas cambiar o establecer el color del texto, un
color o una imagen de fondo y los colores de los
enlaces que tendrá la página.
Por ejemplo:

<BODY BACKGROUND =“nombre de la imagen”
BGCOLOR =“color del fondo” TEXT =“color del
texto” LINK =“color enlace” VLINK =“color enlace
v” ALINK =“color enlace a”> </BODY>

Permiten cambiar los atributos y la manera como
el texto se verá dentro de la página. Se puede
afectar todo un párrafo, una línea, una palabra o
caracteres individuales simplemente
encerrándolos dentro de las etiquetas
apropiadas. Algunos atributos de texto pueden
ser controlados por diferentes etiquetas.

Es conocida como etiqueta de encabezado
(heading), es utilizada con frecuencia para
escribir títulos y subtítulos, dado que permite
mostrar el texto en negrillas con seis tamaños
diferentes, dependiendo del valor asignado al
atributo “X”.

<HTML>
<HEAD>
<TITLE> Encabezados </TITLE>
</HEAD>
<BODY>
<H1>Este texto tiene el tamaño que le da la etiqueta H1</H1>
</BODY>
</HTML>

Se mostrará de la siguiente manera:

Esta etiqueta permite controlar tres atributos del
texto que se encuentre encerrado entre ellas, su
tamaño (SIZE), su color (COLOR) y el tipo de
fuente (FACE).

La sintaxis completa de la etiqueta FONT es la
siguiente:

Por ejemplo, se propone escribir las siguientes
líneas dentro del cuerpo de una página:
 TEXTO 

 TEXTO 

 TEXTO

HTML solo reconoce un espacio entre
palabras, aunque se hayan escrito dos o más.
Tampoco reconocerá tabuladores y saltos de
línea. Si se quiere que el texto se vea tal y como
fue escrito, este debe encerrarse dentro de las
etiquetas <PRE> </PRE>

<BODY>
Este texto tiene varios espacios
Y un salto de línea
</BODY>

La etiqueta permite forzar un salto de línea
dentro de un texto. Observe que esta etiqueta no
se cierra con , razón por la que se conoce
como etiqueta abierta.

 es otra etiqueta que puede utilizarse abierta
o cerrada. Si se usa de la primera forma, iniciará
un nuevo párrafo dejando una línea en blanco, si
por el contrario se cierra con permite alinear
el párrafo a la derecha, izquierda, etc,
dependiendo del valor asignado al parámetro
ALIGN.

EJEMPLO RESULTADO

Texto con
Texto con Salto de línea
Salto de línea
En este ejemplo iniciaremos aquí
En este ejemplo iniciaremos aquí
 un nuevo párrafo
Un nuevo párrafo
 alineado a la
Alineado a la derecha
derecha 
 alineado a la
izquierda Alineado a la izquierda

 alineado al
centro Alineado al centro

Esta etiqueta es abierta, y dibuja una línea
horizontal con alineación, tamaño y ancho
variables. Se utiliza con frecuencia para separar
secciones de contenido.

Línea de tamaño 10 puntos y ocupando el 30% de la página

<HR ALIGN=“center” SIZE=“10”WIDTH=“30%”>

Línea alineada a la izquierda de tamaño 5 puntos y ocupando la mitad
de la página
<HR ALIGN=“left” SIZE=“5” WIDTH=“50%”>

Línea alineada a la derecha de tamaño 20 puntos y ocupando la mitad
de la página
<HR ALIGN=“right” SIZE=“20” WIDTH=“50%”>

Línea sencilla que ocupará el 90% de la página

<HR>

EJEMPLO EFECTO RESULTADO

<CENTER>TEXTO</C
Texto centrado texto
ENTER>
texto Texto en negrillas texto

texto Texto en itálica texto

texto Texto subrayado texto
Textotexto
Textotexto
<S>texto</S> Texto tachado texto

Las pagina web además de mostrar texto son
capaces de desplegar imágenes que han de ser
creadas en cualquiera de los formatos: JPG –
PNG - GIF. Una imagen con extensión BMP –
CDI – PCX o cualquier otro formato diferente no
será exhibida en el explorador.

Para insertar imágenes lo único que se necesita
conocer es la ruta y nombre del archivo que lo
contiene. La etiqueta <IMG> junto con su atributo
SRC=“ruta y/o nombre del archivo” permite
mostrar una imagen:

<IMG SRC=“logo.png”>

Para facilitar la navegación de una página
cuando su contenido es demasiado largo y al
desplegarla ocupa mas de una pantalla, se
pueden colocar enlaces que lleven al usuario a
sitios específicos o predeterminados de la misma.

Para esto se debe utilizar dos atributos de la
etiqueta <A>:

<A NAME=“nombre”>texto de marca</A>
<A HREF=“#NOMBRE”>texto de enlace</A>
<A HREF=“pagina.html”>texto de enlace</A>
<A HREF=“pagina.html”>
<IMG SRC=“logo.png”>
</A>

Etiquetas básicas en html

Más contenido relacionado

La actualidad más candente

Destacado

Similar a Etiquetas básicas en html

Más de Andrés Quintero Macea

Etiquetas básicas en html