Etiquetas básicas de HTML

Etiquetas Básicas de
HTML
{
Por: Andrés Iván Martínez

La etiqueta <IMG> te servirá para situar imágenes en
una página.
 Incluir imágenes en una página web es muy sencillo,
simplemente debemos tener en cuenta que las
imágenes tienen que tener los formatos GIF, JPG o
PNG. Las imágenes dentro de una página web se
incluyen utilizando la etiqueta <img>, que no tiene
una etiqueta correspondiente de cierre. Ejemplo:
 <img
src="http://www.aprenderaprogramar.com/images/l
ogo.png" alt="Logotipo APR2">
Imágen

 A la etiqueta <IMG> se le pueden añadir varios atributos para controlar
la manera en que un navegador administra una imagen. Estos atributos
son los siguientes:
 bullet width="x" Permite al navegador predeterminar el ancho, en
pixles, que tendrá tu imagen.
 bullet height="x" Junto con el atributo width, el navegador puede
preparar el espacio necesario para tu imagen antes de que se muestre.
 bullet border="x" Para añadir o eliminar un borde, donde la x será un
valor numérico.
 bullet align="xxx" Puedes alinear una imagen horizontal y/o
verticalmente en una página usando este atributo.
 bullet alt="descripción_de_la_imagen" El atributo alt te permite
describir la imagen para los navegadores de sólo texto, así como
etiquetar la imagen antes de que se cargue en una página.
 bullet hspace="x" horizontal space, se usa para añadir espacio vacío, con
un valor numérico, en la coordenada horizontal de una imagen.
 bullet vspace="x" vertical space, controla el espacio de la imagen en las
coordenadas verticales.
Atributos

 La etiqueta <body> define el cuerpo de un
documento.
Dentro del cuerpo del documento se incluye
todo el contenido del mismo, por ej. textos,
enlaces, imágenes, tablas, etc.
Body

 Con esta etiqueta puede usar los siguientes
propiedades o atributos:
 BACKGROUND=imagen ←-Imagen para el fondo
de la pagina
 BGCOLOR=Color ←– Color del fondo de la pagina
 TEXT=Color ←- Color del texto dentro de la pagina
 LINK=Color ←- Color para las ligas, enlaces o
hipervinculos que se encuentren dentro del
documento
 - See more at:
http://www.programacionfacil.com/html/body#sthas
h.gFBkyfOc.dpuf
Atributos

 Para escribir encabezados tenemos que utilizar
las etiquetas <h>.
 Esta etiqueta viene acompañada de un número,
desde el 1 hasta el 6, predefiniendo éstos el
tamaño del encabezado. Así, <h1> sería el
encabezado más grande mientras que <h6>
sería el más pequeño.
Encabezados

 Muchos tipos de texto son aplicables
 <h1> Texto muy grande</h1>
 <h2>Texto grande</h2>
 <h3>Texto algo más grande de lo normal</h3>
 <h4>Texto normal</h4>
 <h5>Texto pequeño</h5>
 <h6>Texto muy pequeño</h6>
Atributos

 Llamada <font>
Esta etiqueta especifica el tamaño, color y tipo de fuente para
un texto.
 Ejemplo:
 <font size="3" color="red">Tamaño: 3 - color: rojo</font><br>
<font face="serif" color="blue">Nombre de fuente: serif - color:
azul</font><br>
<font face="verdana" color="green" size="5">Nombre de
fuente: verdana - color: verde</font>
 Resultado
 Tamaño: 3 - color: rojo
Nombre de fuente: serif - color: azul
Nombre de fuente: verdana - color: verde - tamaño: 4
Fuente

 Las propiedades del texto pueden modificarse a
través de la etiqueta . Para ello, podemos insertar el
texto entre las etiquetas y , especificando algunos de
los atributos de la etiqueta:
 FACE: fuente. nombre de la fuente, o fuentes
 COLOR: color del texto. número hexadecimal o texto
predefinido
 SIZE: tamaño del texto. valores del 1 al 7, siendo por
defecto el 3, o desplazamiento respecto al tamaño por
defecto, añadiendo + o - delante del valor
Atributos

 Las tablas se usan con profusión en las páginas Web, muchas veces
debido a que son el único instrumento con el que se cuenta, para
asegurarse que las cosas estarán en su sitio. Para definir una tabla se
usan las etiquetas:
 <TABLE> y </TABLE> :son las etiquetas donde está contenida la tabla
 <TR> y </TR>: son las etiquetas que indican el comienzo y fin de una fila
(<th> y </th> si es una fila de cabecera)
 <TD> y </TD>: señalan una celda.
 La tabla se va definiendo declarando una fila y a continuación las celdas
que contiene esa fila, luego otra fila y sus celadas, etc. No es necesario
que todas las filas contengan el mismo número de celdas.
Tablas

 El atributo width establece el ancho de la tabla, en
porcentaje o en píxeles.
 El atributo border establece el grosor del borde de la
tabla. El valor se interpreta en píxeles y no admite
unidades. Si el valor es 0 o el atributo no está
presente, los navegadores no dibujan ni el borde
exterior de la tabla ni los bordes interiores de las
celdas.
 El atributo rules establece qué lados de los bordes
interiores de la tabla son visibles.
 El atributo cellspacing establece la separación entre
celdas y entre las celdas y el borde.
 El atributo frame establece qué lados del borde
exterior de la tabla son visibles.
Atributos

 Para programar HTML, los hipervínculos se indican con la
etiqueta <a>.

 Dicha etiqueta <a> deberá incluir el atributo href para especificar el
destino del hipervínculo, y luego, como todas las etiquetas de
HTML, se deberá cerrar de la manera </a> para indicar el fin del
texto o de la imagen que contiene el hipervínculo.

 Entonces, el hipervínculo en HTML luce de la siguiente manera:

 <a href=”dirección del sitio”>Texto del Hipervínculo</a>

 Ejemplo:

 <a href=mcgrecia.blogspot.mx>Blog de Computación</a>
Hipervínculos

 Utilizando sólo la etiqueta<a> no es posible
establecer la dirección a la que apunta cada
enlace. Como no es viable crear una etiqueta
por cada enlace diferente, la solución consiste
en personalizar las etiquetas HTML mediante
cierta información adicional llamada atributos.
 De esta forma, se utiliza la misma
etiqueta <a> para todos los enlaces de la página
y se utilizan los atributos para indicar la
dirección a la que apunta cada enlace.
Atributos

 La etiqueta <p> crea un párrafo nuevo. Debe
configurar el campo de texto como campo de
texto de varias líneas para poder utilizar esta
etiqueta.
 La etiqueta <img> admite el atributo siguiente:
 Align Especifica la alineación del texto dentro
del párrafo; los valores válidos
son left, right, justify y center.
Párrafo

 La marca <P> sirve para definir un nuevo párrafo de texto,
indicando al navegador que el mismo debe empezar en una
nueva línea y colocarse a la derecha, a la izquierda o centrado.
Si no se especifica otra cosa, la marca <P> alinea el texto por
defecto a la izquierda. Para indicar otros tipos de alineación,
existen atributos específicos:
<P ALIGN=left>
Define un párrafo y alinea el texto a la izquierda(left).
<P ALIGN=right>
Define un párrafo y alinea el texto a la derecha (right).
<P ALIGN=center>
Define un párrafo y centra el texto (center).
Atributos

Etiquetas básicas de HTML

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (13)

Destacado

Destacado (20)

Similar a Etiquetas básicas de HTML

Similar a Etiquetas básicas de HTML (20)

Último

Último (20)

Etiquetas básicas de HTML