Para empezar a crear nuestra primera página tenemos que iniciar el programa editor de texto e ir introduciendo las etiquetas y su contenido. En esta página conoceremos todo lo básico y esencial dentro de un documento HTML.
Observación: por necesidad se ha cambiado el signo mayor por ) y el signo menor por el ), para poder escribirlo en el blog caso contrario no se ubiera visto los simbolos... tomar esta consideración al copiar en su cuaderno y al editor de pagina (bloq de notas)
PÁRRAFOS
Párrafos. Las etiquetas de párrafo (P)nos servirán para iniciar un nuevo párrafo de texto. No necesita la etiqueta (/P)al final si no están alineados de ninguna manera.
Los párrafos pueden alinearse. En este caso sí que necesitan su correspondiente etiqueta de cierre (/P). Son las siguientes:
(P ALIGN="LEFT")Para alinear el texto con el margen izquierdo:
Este párrafo está alineado a la izquierda
(P ALIGN="CENTER")Para centrar el texto:
Este párrafo está centrado.
(P ALIGN="RIGHT")Para alinear el texto con el margen derecho:
Este párrafo está alineado a la derecha
(P ALIGN="JUSTIFY")Para alinear el texto a los dos márgenes. Es ignorado por muchos navegadores, pero algunos no, como el Explorer 4.0.
Eso es un ejemplo el alineamiento justificado. Si se observa este breve párrafo con exploradores como el Microsoft Internet Explorer 4.0 podrás observar que los dos extremos, izquierdo y derecho, están alineados. Recuerda que para poder apreciar este efecto en los párrafos de texto, necesitas escribir más de 2 líneas.
Si se quiere hacer un salto de línea o retorno de carro, habrá que usar la eiqueta (BR). Por ejemplo:
(P)Esto(BR)es un párrafo
Se vería así:
Esto
es un párrafo
Dos (BR)equivalen a un (P). Estos dos ejemplos se verían igual:
(P)Esto es un párrafo
(P)Esto es otro
(P)Esto es un párrafo(BR) ; (BR);
Esto es otro
También puede usarse la etiqueta (NOBR)...(/NOBR). Es para no permitir el salto de línea, es decir, para hacer líneas muy largas en páginas en las que haya que usar la barra de desplazamiento horizontal.
CABECERAS
________________________________________
Son para poner títulos en nuestras páginas. Van entre las etiquetas (Hx)y (/Hx), donde x en un número del 1 al 6. 1 es el número mayor y 6 el número menor. El que corresponde al tamaño estándar del texto es 3. Estos números no tienen nada que ver con el número de píxeles ni con los números de la etiqueta (FONT)que veremos posteriormente.
Usaremos la cabecera H1 o la H2 para el título principal de la página, y los otros tamaños menores para los títulos inferiores de segunda categoría.
(H1)Prueba(/H1)se verá como:
Prueba
(H2)Prueba(/H2)se verá como:
Prueba
(H3)Prueba(/H3)se verá como:
Prueba
(H4)Prueba(/H4)se verá como:
Prueba
(H5)Prueba(/H5)se verá como:
Prueba
(H6)Prueba(/H6)se verá como:
Prueba
LÍNEAS HORIZONTALES
________________________________________
Líneas horizontales. En inglés horizontal rules. Para introducirlos hay que usar la etiqueta (HR). Así se creará una línea embutida en el fondo que llegue de lado a lado de la página.
También se puede modificar. Para variar la anchura hay que usar el atributo WIDTH=x%, donde x es el porcentaje del ancho de la pantalla. Para que ocupe el 75% habría que poner:
(HR WIDTH="75%”)
Si se quiere variar la anchura en píxels hay que introducir el valor de ellos en WIDTH=x, pero sin el símbolo %:
(HR WIDTH="250”)
Se puede variar la alineación con el atributo ALIGN=x, donde x es LEFT o RIGHT.
(HR WIDTH="50%" ALIGN="LEFT")para alinear a la izquierda:
(HR WIDTH="50%" ALIGN="RIGHT")para alinear a la derecha:
Se puede variar el espesor con SIZE=x, donde x es el número de píxels:
(HR SIZE="15”)
Y por último se puede hacer que la línea no esté sombreada con el atributo NOSHADE:
(HR NOSHADE)
________________________________________
FORMATEO DEL TEXTO
________________________________________
Formateo del texto. Veremos una serie de etiquetas para el texto:
Líneas en blanco, con (BR)(P).
(BR)(P)
(BR)(P)
(BR)(P)
(BR)(P)
quedaría así:
Espacios. Nos pueden servir para separar imágenes de textos. La etiqueta es
Negrita, cursiva, subrayado y tachado. Necesitan etiqueta de cierre. Son:
(B)negrita(/B)
(I)cursiva(/I)
(U)subrayado(/U)
(S) tachado(/S)
Es posible usarlos a la vez,(B)(I)(U)(S)texto(/S)(/U)(/I)(/B)
EJEMPLO
PRUEBA del texto.
Hay otras etiquetas que equivalen a estas, como:
(STRONG)= (B);
(CITE)y(EM)= (I); y
(STRIKE)= (S).
Aumentar o disminuir tamaño del texto. Se puede hacer de una forma muy sencilla con (BIG)...(/BIG)para aumentarlo y con (SMALL)...(/SMALL)para disminuirlo. Por ejemplo:
Este es un texto (BIG) Más grande(/BIG)
Se vería como
Este es un texto más grande
Este es un texto (SMALL)más pequeño(/SMALL)
Se vería como
Este es un texto más pequeño
En vez de usar estas dos etiquetas, puedes usar la etiqueta (FONT) que se explica más abajo.
Preformateado. La etiqueta es (PRE)con etiqueta de cierre. La característica es que se verá con letra Courier respetando espacios y cambios de lía, por ejemplo:
(PRE)
Hola
Esto es una prueba del preformateado
(/PRE)
y quedaría así:
Hola
Esto es una prueba del preformateado
Máquina de escribir. La etiqueta es (TT)con etiqueta de cierre. Es como el anterior pero sólo cambia el tipo de letra, por ejemplo (el mismo que pusimos en PRE):
(TT)
Hola
Esto es una prueba del preformateado
(/TT)
y quedaría así:
Hola Esto es una prueba del preformateado Como ves no ha respetado los espacios ni los cambios de línea.
Citas textuales. La etiqueta es (BLOCKQUOTE)con etiqueta de cierre, para resaltar partes de texto con márgenes a ambos lados, por ejemplo:
(BLOCKQUOTE);
xxxxxxxxxxxxxxxxx xxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxxxxxxx xxxx xxxxxxxxxxx xxxxxxxxxxxx xxxxxxxxx xxxxxxxxxxxxxxx xxxxx xxxxxxxxxxxx
(/BLOCKQUOTE>;
y quedaría así:
xxxxxxxxxxxxxxxxx xxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxxxxxxx xxxx xxxxxxxxxxx xxxxxxxxxxxx xxxxxxxxx xxxxxxxxxxxxxxx xxxxx xxxxxxxxxxxx
Texto parpadeante. Sólo lo incorpora Netscape Navigator. La etiqueta es (BLINK)y (/BLINK);, y quedaría así:
;
Índices y subíndices.
Las etiquetas son (SUP)para el superíndice y (SUB)para el subíndice (ambas con etiqueta de cierre), por ejemplo:
cm(SUP);3(/SUP);
cm
3H(SUB);2(/SUB);SO(SUB);4(/SUB>;
H
2SO
4Etiqueta FONT.
Tiene etiqueta de cierre, y nos permite variar el tamaño, el color, y el tipo de letra de un texto determinado. Utiliza para ello los atributos siguientes:
size="x", siendo "x" el número del tamaño, de 1 a 8, por defecto 3; o +/-, que indican si se usa un tamaño inferior o superior),
bgcolor="xxyyzz" (siendo "xxyyzz" un número hexadecimal). Para saber qué es esto mira el tema de fondos) y
face="xxx" (siendo "xxx"el nombre de la fuente). Si la fuente tiene dos palabras o más es necesario poner comillas, y se pueden colocar varios nombres para usar unas fuentes en caso que otras no existan. Si la fuente no está instalada en el ordenador se verá Times New Roman). Ejemplo:
(FONT SIZE=4 COLOR="AA0000" FACE="Arial, Verdana")Prueba de texto(/FONT).
...que quedaría así:
Prueba de textoObserva cómo hay dos nombres de fuentes. En caso de que Arial no esté instalada se verá con Verdana, y si ésta tampoco lo está se verá entonces con Times New Roman: la fuente por defecto.
En el navegador saldrá:
Al igual que en las viñetas existe el atributo u opción “TYPE”, el cual va a permitir indicar el tipo de numeración que se va a dar de cualquiera de las siguientes formas
Las páginas html se dividen en un encabezado y un cuerpo. Para el encabezamiento tenemos que poner los "tags"
Tenemos que ponerlo dentro de las instrucciones inicial y final de página ( ) por lo tanto nos queda
Para escribir títulos se usa la etiqueta (hx) y (/hx) en donde x es un número.