Etiquetas Del Documento HTML: abril 2013

miércoles, 24 de abril de 2013

La etiqueta <IMG>

La etiqueta <IMG> te servirá para situar imágenes en una página. Es una etiqueta "verdadera", pues no tiene etiqueta de cierre:

<IMG>

La etiqueta <IMG> requiere un origen de datos obligatorio dado por el atributo SRC=. Indica la imagen en cuestión:

<IMG SRC="bander.gif">

Tan sólo el código anterior es necesario para añadir una imagen a tu página, mostrando la imagen situada en el mismo directorio del documento HTML.

Atributos de la etiqueta <IMG>

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:

width="x" Permite al navegador predeterminar el ancho, en pixles, que tendrá tu imagen.

height="x" Junto con el atributo width, el navegador puede preparar el espacio necesario para tu imagen antes de que se muestre.

border="x" Para añadir o eliminar un borde, donde la x será un valor numérico.

align="xxx" Puedes alinear una imagen horizontal y/o verticalmente en una página usando este atributo.

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.

hspace="x" horizontal space, se usa para añadir espacio vacío, con un valor numérico, en la coordenada horizontal de una imagen.

vspace="x" vertical space, controla el espacio de la imagen en las coordenadas verticales.

<HTML>
<HEAD>
<TITLE>Añadiendo imágenes</TITLE>
</HEAD>
<body>
<IMG SRC="images/bander.gif">
</body>
</HTML>

Estos Son Codigos Faciles De Realizar Con Los Atributos Haces Cosas Que Alacanzaras Con Estos :D

martes, 16 de abril de 2013

La Etiqueta Font

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:

Atributo	Significado	Posibles valores
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

Por ejemplo, para insertar el texto:

Bienvenidos a www.aulaclic.com

Habría que escribir:

Bienvenidos a www.ginapaolaruiz.blogspot.com

También es posible definir una fuente para todo el documento. Para ello, hay que insertar la etiqueta <basefont> después de la etiqueta <body>.

La etiqueta <basefont> no necesita una etiqueta de cierre, y permite modificar los mismos atributos del texto que la etiqueta .

Por ejemplo:

<body>
<basefont color="#006699" size="4" face="Arial">
...

Este código haría que la fuente del documento fuera por defecto de color azul, de tamaño 4 y Arial. Si después de indicar la etiqueta <basefont> o , el navegador encuentra otra etiqueta , la que prevalece es siempre la última que se encuentra.

Resaltado del texto ...

Existen una serie de etiquetas que permiten aplicar diferentes estilos al texto que se encuentra entre ellas, y generalmente se utilizan para resaltarlo. Estos estilos pueden agruparse según vayan asociados al tipo de letra o a la información que represente el texto. No hay que olvidar que todas estas etiquetas necesitan una etiqueta de cierre, y que pueden aplicarse varias etiquetas al mismo texto.

A continuación se muestran algunas etiquetas asociadas al tipo de letra:

Etiqueta	Significado	Ejemplo
<b>	negrita	curso HTML
<i>	cursiva	curso HTML
<u>	subrayado	curso HTML
<s>	tachado	~~curso HTML~~
<tt>	teletipo (máquina de escribir)	`curso HTML`
<big>	aumenta el tamaño de la fuente	curso HTML
<small>	disminuye el tamaño de la fuente	curso HTML

A continuación se muestran algunas etiquetas asociadas al tipo de información:

Etiqueta	Significado	Ejemplo
<cite>	cita	curso HTML
<code>	ejemplo de código	`curso HTML`
<dfn>	definición	curso HTML
<del>	eliminado	~~curso HTML~~
<em>	énfasis	curso HTML
<ins>	insertado	curso HTML
<kbd>	teclado	`curso HTML`
<samp>	muestra	`curso HTML`
<strong>	destacado	curso HTML
<sub>	subíndice	curso _HTML
<sup>	superíndice	curso^HTML
<var>	variable	`curso HTML`

Las etiquetas más utilizadas son las asociadas al tipo de letra, ya que son más fáciles de recordar, y en muchos casos los resultados son los mismos que los de aplicar una etiqueta diferente. Por ejemplo, el resultado de aplicar las etiquetas y es el mismo. Incluso a veces algunos estilos asociados al tipo de información pueden representarse de forma distinta según el navegador.

Por ejemplo, para insertar el texto:

Bienvenidos a www.ginapaolaruiz.blogspot.com

Habría que escribir:

Bienvenidos a <tt>www.ginapaolaruiz.blogspot.com</tt>

¿Que Es La Etiqueta Body ?

Cuerpo del documento (body)
El cuerpo es la segunda sección de la estructura del HTML y está definida por las etiquetas <BODY>...</BODY>.
Dentro de las etiquetas del cuerpo se localiza toda la información que será desplegada en los exploradores. Por ejemplo, podemos encontrar elementos tales como: encabezados, textos, tablas, imágenes, animaciones, etcétera, que contienen sus propios atributos y que repasaremos una a una en los siguientes temas.

A su vez, la etiqueta del cuerpo <BODY>...</BODY>, contienen atributos que controlan la parte visible del documento. Estos atributos o propiedades son popularmente usados para agregar color y diseño a la página.
Un ejemplo de lo anterior seria:

index.html
<BODY bgcolor="white” text="blue" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> .....Este es el cuerpo de mi página </BODY>
Ver código completo	Así se vería la página

Los atributos comúnmente utilizados dentro de la etiqueta <BODY>son los que a continuación se listan:

bgcolor	Determina el color del fondo de la página.
background	Especifica una imagen determinada para ser usada como fondo de la página.
text	Color del texto de la página.
link	Color de las ligas o enlaces que contiene la página.
vlink	Color de las ligas o enlaces visitadas dentro de la página.
alink	Color que aparece al darle clic sobre una liga o enlace.
topmargin	Es la distancia en píxeles que existe entre la orilla superior del navegador y el contenido.
leftmargin	Es la distancia en píxeles que existe entre la orilla izquierda del navegador y el contenido.
marginheight	Tamaño del margen superior e inferior.
marginwidth	Tamaño de l margen izquierdo y derecho.

Para editar la etiqueta de BODY dese el editor:

En la pestaña de HTML

1. Posiciona el cursor sobre la etiqueta de <BODY>.2. Aparecerá en el Panel de Propiedades, la listas de ajustes que se pueden hacer para esa etiqueta.3. Selecciona o introduce los valores que consideres apropiados para tu página, dando un clic en cada campo.

En la pestaña de Diseño Sigue las indicaciones descritas en la pestaña de HTML.

Una vez asignados los atributos de la etiqueta <BODY>...</BODY>, se puede continuar programando el contenido principal del documento, que estudiará punto por punto en el tema siguiente.

IDEAS

Dentro de la etiqueta de <BODY>...</BODY> se incluye toda la información que es destinada a desplegarse dentro el documento.