ETIQUETA BODY
Eso es lo que llamamos el “cuerpo” del documento. Es la parte
visible. Pero debemos saber que ese cuerpo, o sea, que la etiqueta
body también podemos personalizarla para darle el aspecto que
nosotros deseemos.
COLOR DE
FONDO:
BGCOLOR
A través de este parámetro podremos definir el color de fondo que queramos
que tenga nuestra página. Un ejemplo muy simple es el siguiente: Si
queremos que nuestra página quede con un fondo rojo deberemos escribir:
<body bgcolor=”#FF0000″></body>
IMAGEN DE
FONDO:
BACKGROUND
HTML
Puede que no quieres que tu página tenga un color sólo de fondo, sino que
quieras que tu página tenga una imagen. En ese caso deberás indicarlo con
la etiqueta “background”. La etiqueta quedaría de la siguiente manera:
<body background=”URL”> </body>
Dónde leemos “URL” deberemos escribir la dirección de la imagen que
queramos que sea nuestro fondo. Una cosa muy importante que debes saber
es que si la imagen no es suficientemente grande para rellenar toda la
página, la imagen se repetirá tanto a lo ancho como a lo largo hasta rellenar
todo el espacio.
COLOR DE
TEXTO: TEXT
Una vez tenemos el fondo definido, tendremos que predefinir ahora
el color del texto de nuestra web. Es decir, tendremos que decirle
al navegador de qué color queremos que sea nuestro texto. Esto lo
definiremos con el parámetro “text”.
Como ejemplo vamos a poner que queremos que nuestro texto sea
en negro, con lo que escribiremos lo siguiente:
<body text= “#000000”></body>
.
MÁRGENES: LEFTMARGIN,
TOPMARGIN, RIGHTMARGIN
Y BOTTOMMARGIN
Para especificar los márgenes utilizaremos el parámetro margin, con su
correspondiente indicación delante. Así encontraremos “leftmargin” para el
margen izquierdo, “topmargin” para el margen de arriba, “rightmargin” para
el margen de la derecha y “bottommargin” para el margen de abajo.
Si queremos que nuestros márgenes sean de 10 píxeles por todas partes
escribiremos lo siguiente:
<body leftmargin=”10px” topmargin=”10px” rightmargin=”10px”
bottommargin=”10px”></body>
.
COLOR DE LINKS:
LINK, ALINK Y
VLINK
En body también podemos ( y de hecho debemos hacerlo) definir el color de
los vínculos de nuestra páginas, definir el color con el que se mostraran los
links. Aquí debemos diferenciar tres tipos de instrucciones: Debemos definir
el color del link (con la etiqueta “link”), el color del link activo (con la
etiqueta “alink”) y el color del link ya visitado (con la etiqueta “vlink”).
Así pues, si queremos que nuestra página tenga un color de enlaces (de
links) de color rojo y que esos enlaces sean rojos cuando estén activos y se
queden en azul cuando estén inactivos deberemos escribir lo siguiente:
<body link= “#FF0000” alink= “#FF0000” vlink= “# 0000FF”></body>
FORMATEO DE
TEXTO
Anteriormente ya hemos visto en un pequeño texto introductorio como se ponía la negrita y la itálica.
Pero eso era solamente introductorio. A continuación lo vamos a explicar de una forma más detallada.
Las etiquetas deben rodear al texto. Es decir, la etiqueta debe abrirse y cerrarse, conteniendo el texto
o la palabra que queramos transformar, entre medias. En el ejemplo de la negrita se abriría <b> y se
cerraría </b>.
Se pueden combinar diferentes formatos, o sea, diferentes etiquetas. Por ejemplo, si queremos que
un texto esté en negrita y en cursiva escribiríamos esto:
<b><i>Este texto está escrito en negrita y en cursiva</i></b>.Cuando combines, ten cuidado a la
hora de cerrar las etiquetas. Debes cerrar las etiquetas por orden, de la más interior a la más exterior.
Por último, recordar que se puede escribir las etiqutas en minúsculas o en mayúsculas.
NEGRITA HTML
Existen dos etiquetas que harán que nuestro texto se
convierta en negrita. La utilización de cualquiera de ellas
es indiferente. Puedes usar la que prefieras.
La primera es la etiqueta <b> y la otra es la etiqueta
<strong>. Aquí va un ejemplo:
EJEMPLO:
Este palabra la vamos a poner en <b>negrita</b> y esta otra
<strong>también</strong>
Este palabra la vamos a poner en negrita y esta otra también
CURSIVA HTML
Para escribir un texto en cursiva debemos utilizar la etiqueta <i> (y por supuesto
cerrarla con la etiqueta </i>).
También podemos utilizar la etiqueta <em>. Como en el caso de la negrita, es
indiferente el uso de una u otra. Acá un ejemplo:
Esta palabra la vamos a poner en <i>cursiva</i> y esta otra
<em>también</em>
Esta palabra la vamos a poner en cursiva y esta otra también
SUBRAYADO
HTML
Si queremos que la palabra o el texto quede
subrayado, deberemos rodearlo con la etiqueta
<u> y cerrarlo con su correspondiente etiqueta. O
sea, </u>. Así subrayaríamos una frase importante:
<u>Así subrayaríamos una frase importante</u>
Así subrayaríamos una frase importante
PALABRAS MÁS
GRANDES O MÁS
PEQUEÑAS
Puede que en una frase queramos destacar una palabra por
medio de una variación de tamaño sin necesidad de utilizar
los encabezados(los explicaremos más adelante). Pues esta
variación de tamaño la conseguiremos gracias a las etiquetas
<big> y <small>.
Sus propios nombres en inglés nos indican cuáles serán sus
funciones: <big> agrandará el texto y <small> lo disminuirá.
SUPERÍNDICES Y
SUBÍNDICES
HTML
Mediante el Html también podemos escribir fórmulas
matemáticas. Gracias a las etiquetas siguientes podrás
escribir subíndices y superíndices fácilmente. La
etiqueta <sub> te servirá para escribir un subíndice y
<sup> será tu etiqueta para un superíndice.
Así nos queda un ejemplo como el siguiente:
EJEMPLO:
■ Gracias a estas etiquetas podemos escribir cualquier formula
matemática como esta: H <sub>2</sub> O o números elevados a
potencias 7<sup>3</sup>.
■ Gracias a estas etiquetas podemos escribir cualquier formula
matemática como esta: H 2 O o números elevados a potencias
PÁRRAFOS Y
SALTOS DE
LÍNEA
En html para dejar un salto de línea debemos
utilizar una serie de etiquetas, de código, que el
navegador interpretará cómo tal. Esas etiquetas
son <br/> </p> o </pre>. A continuación te
explicaremos cada una de ellas.
SALTOS DE LÍNEA
HTML
Ya hemos comentado anteriormente que en
html los saltos de línea escritos en código no son
tal una vez el navegador interpreta el código.
Vamos a explicar esto con un claro ejemplo:
EJEMPLO:
Puedes escribir un texto como este
y el navegador no lo interpretará así
Y se verá así:
Puedes escribir un texto como este
y el navegador no lo interpretará así
SALTOS DE LÍNEA
HTML
Existen dos etiquetas para indicar que queremos hacer
un salto de línea normal. Son las etiquetas <br> y <br/>
ambas son interpretadas igual por el navegador. Esta
etiqueta no hace falta abrirla y cerrarla, sólo con
escribirla el navegador ya la interpreta.
Así pues el texto anterior deberíamos escribirlo de la
siguiente forma:
EJEMPLO:
Puedes escribir un texto como este <br/>
y el navegador no lo interpretará así
PÁRRAFOS EN
HTML
Para indicarle al navegador que queremos poner ese texto en un párrafo,
debemos escribirlo entre las etiquetas <p> y su cierre </p>.
Así el texto quedará dentro de un párrafo, separado por un espacio en
blanco por encima y uno por abajo.
El texto del párrafo lo puedes alinear utilizando la etiqueta align utilizando
los parámetros “center” (para alinearlo al centro), “right” (para alinearlo a la
derecha), “left” (para alinearlo a la izquierda) y “justify” (para justificar el
texto).
Un ejemplo de esta etiqueta con sus respectivos parámetros es el siguiente:
EJEMPLO:
<p align="center">Este texto se alineará al centro</p>
<p align="right">Este texto se alineará a la derecha</p>
<p align="left">Este texto se alineará a la izquierda</p>
SE VERA ASI:
Este texto se alineará al centro
Este texto se alineará a la derecha
Este texto se alineará a la izquierda
LA ETIQUETA
<PRE>
La etiqueta <pre> la puedes utilizar para que el navegador
interprete el texto escrito tal y como está.
Como ejemplo mostraremos este texto:
Escribo esta línea así
Dejo dos líneas de separación
y escribo tres más.
QUEDA SI UTILIZANDO PRE
Escribo esta línea así
Dejo dos líneas de separación
y escribo tres más.
MUCHAS GRACIAS
