En el diseño web, no sólo es importante el contenido sino también la apariencia.
A continuación voy a ir nombrando las etiquetas que hay que tener en cuenta para cambiar el tamaño de la letra y poner la letra en negrita o cursiva.
A) ETIQUETAS PARA TÍTULOS : <H(1...6)> Título </H(1..6)>
Se utiliza para resaltar los títulos (TAMAÑO y NEGRITA).
Incluye por defecto un salto de línea.
Hay 6 tipos: H1......H6 (de mayor a menor).
Ejemplo 3: Comprueba cómo queda este código en el buscador.
<HTML>
- <HEAD>
- <TITLE>HEADING LEVELS</TITLE>
- </HEAD>
<BODY>
<H1>THIS IS H1.</H1> THIS IS NORMAL SIZE.
<H2>THIS IS H2.</H2> THIS IS NORMAL SIZE.
<H3>THIS IS H3.</H3> THIS IS NORMAL SIZE.
<H4>THIS IS H4.</H4> THIS IS NORMAL SIZE.
<H5>THIS IS H5.</H5> THIS IS NORMAL SIZE.
<H6>THIS IS H6.</H6> THIS IS NORMAL SIZE.<HR>
</BODY>
</HTML>
B) CENTRAR TEXTO:
Tenemos 2 opciones:
B1- USO DEL ATRIBUTO ALIGN="CENTER": Se puede combinar con H_ y con P
<H1 ALIGN="CENTER"> Título centrado </H1> : para centrar títulos
<P ALIGN="CENTER"> Texto centrado </P> : para centrar párrafos
**Los atributos añaden información adicional a la etiqueta a la que va unida.
B2- USO DE <CENTER> ...... </CENTER>: para centrar un conjunto de texto.
PROBLEMA 1: Crea un página web cuya nombre sea "TEXTO CENTRADO", su título "TEXTO CENTRADO" y en la cual aparezca el siguiente texto:
In other words, we are centering a "paragraph"
or "block of text" with each line centered on the screen
just as these lines are centered (hopefully).
To end centering a block of text,
we use the </P> tag which is the closing paragraph tag.
This </P> tag is a new tag for us
and one that you may not end up using all that often.
But it does have its uses and this is one of them.
Choose DOCUMENT SOURCE from the VIEW menu
if you want to see how I centered these lines.
C) ALINEAR TEXTO A LA DERECHA:
D) ALINEAR TEXTO A LA IZQUIERDA:
E)TEXTO EN NEGRITA:
Tenemos dos opciones:
<H1 ALIGN="RIGHT"> Título a la derecha </H1> : para alinear títulos a la derecha
<P ALIGN="RIGHT"> Texto a la derecha </P> : para alinear párrafos a la derecha
D) ALINEAR TEXTO A LA IZQUIERDA:
<H1 ALIGN="LEFT"> Título a la izquierda </H1> : para alinear títulos a la izquierda
<P ALIGN="LEFT"> Texto a la izquierda </P> : para alinear párrafos a la izquierda
E)TEXTO EN NEGRITA:
Tenemos dos opciones:
<STRONG> Texto que quieres que aparezca en negrita </STRONG>
<B>Texto que quieres que aparezca en negrita </B>
**(Negrita en inglés se escribe "Bold")
<B>Texto que quieres que aparezca en negrita </B>
**(Negrita en inglés se escribe "Bold")
F)TEXTO EN CURSIVA:
<EM> Texto que quieres que aparezca en CURSIVA </EM>
G)TEXTO SUBRAYADO:
<U> Texto que quieres que aparezca SUBRAYADO </U>
**(Subrayado en inglés se escribe "Underlined").
EJEMPLO 4: Analiza el siguiente código y comprueba cómo queda este código en el buscador.
<HTML>
<HEAD>
<TITLE>OUTDOOR LIVING - ONTARIO</TITLE>
</HEAD>
<BODY>
<H2 ALIGN="CENTER">OUTDOOR LIVING IN ONTARIO</H2>
<H3>POINTS OF INTEREST</H3><HR>
<P>Northern Ontario:
<P><STRONG>Five Mile Lake Provincial Park</STRONG>
<P><EM>1.5 square miles.</EM> Camping, fishing (<EM>walleye, northern pike, brook trout</EM>), canoeing, self-guided nature trails.
<P><STRONG><EM>Recommended</EM></STRONG> <HR>
</BODY>
</HTML>
PROBLEMA2: Abre el blog de notas y diseña el código HTML para que en el buscador aparezca el siguiente texto con el mismo formato.
TOSSED SALAD
Simple and attractive
1 large bunch of greens, preferably mixed
10 cherry tomatoes quartered
DRESSING
1/2 cup Mayonnaise
2 tbsp. Minced dill or sweet pickle
1 tsp. Prepared mustard
1/4 tsp. Onion powder
1 tsp. Granulated sugar
1 tbsp. Milk
Have greens ready in separate containers in refrigerator.
Dressing: Combine all ingredients together in a small bowl. Mix well. Spoon over greens. Toss to coat. Add tomato and toss together lightly. Serves 8
No hay comentarios:
Publicar un comentario