ACERTIJO DE POSICIÓN DE CORREDORES EN LA OLIMPIADA. Por JAVIER SOLIS NOYOLA
Html
1.
2. El HTML (Hyper Text Markup Language) es el lenguaje con el que se
escriben las páginas web. Es un lenguaje de hipertexto, es decir, un
lenguaje que permite escribir texto de forma estructurada, y que está
compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del
documento.
Un documento hipertexto no sólo se compone de texto, puede contener
imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse
como un documento multimedia.
Los documentos HTML deben tener la extensión HTML o htm, para que
puedan ser visualizados en los navegadores (programas que permiten
visualizar las páginas web).
Los navegadores se encargan de interpretar el código HTML de los
documentos, y de mostrar a los usuarios las páginas web resultantes del
código interpretado.
3. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes
angulares (<,>).
<HTML> INICIO DE PÁGINA HTML
<HEAD> ENCABEZADO
<TITLE> TÍTULO DE LA VENTANA
<META> INFORMACIÓN SOBRE PAGÍNA WEB
</TITTLE> CERRAMOS EL TÍTULO
</HEAD> CERRAMOS EL ENCABEZADO
<BODY> INICIO DEL CUERPO
</BODY> CERRAMOS EL CUERPO
</HTML> CERRAMOS EL ENCABEZADO
4. Mediante los títulos, en sus diferentes niveles de importancia,
podemos definir el esqueleto del documento, su estructura básica.
<h1>Mucha importancia</h1>
Mucha importancia
<h2>Menos importancia</h2>
Menos importancia
<h3>Mucha menos importancia</h3>
Mucha menos importancia
5. <HTML>
<HEAD>
<TITLE>
EJERCICIO 1
</TITLE>
</HEAD>
<BODY>
<CENTER> UNIVERSIDAD CENTRAL DEL ECUADOR </CENTER> <BR>
GLORIA DE LA CRUZ
</BODY>
</HTML> TÍTULO
6. Mediante estos atributos determinamos el estilo y el tipo de letra que tendrá la
presentación del documento final.
<p> para marcar un fin de párrafo
<br> para un único retorno de carro.
negrita y cursiva:
<b>Esto en negrita</b> Esto en negrita
<i>esto en cursiva</i> esto en cursiva
Atributo face
Define el tipo de letra. Este atributo es interpretado por versiones de Netscape a
partir de la 3 y de MSIE 3 o superiores. Otros navegadores las ignoran
completamente y muestran el texto con la fuente que utilizan.
<font face="Comic Sans MS,arial,verdana">Este texto tiene otra
tipografía</font>
Atributo size
Define el tamaño de la letra. Este tamaño puede ser absoluto o relativo. Si
hablamos en términos absolutos, existen 7 niveles de tamaño distintos
numerados de 1 a 7 por orden creciente. Elegiremos por tanto un valor size="1"
para la letra más pequeña o size="7" para la más grande.
<font size=4>Este texto es más grande</font>
7. Atributo color
El color del texto puede ser definido mediante el atributo color. Cada color es
a su vez definido por un número hexadecimal que esta compuesto a su vez
de tres partes. Cada una de estas partes representa la contribución del
rojo, verde y azul al color en cuestión.
<font color="red">Este texto está en rojo</font>
color del texto
Vamos a ver una página donde el color de fondo sea negro, y los
colores del texto y los enlaces sean claros. Pondremos el color de
texto balnco y los enlaces amarillos, más resaltados los que no estén
visitados y menos resaltados lo que ya están visitados. Para ello
escribiríamos la etiqueta body así: <body bgcolor="#000000"
text="#ffffff" link="#ffff33" alink="#ffffcc" vlink="ffff00">
8. los párrafos delimitados por etiquetas <p> pueden ser fácilmente
justificados a la izquierda, centro o derecha especificando dicha
justificación en el interior de la etiqueta por medio de un atributo align.
texto alineado a la izquierda escribir
<p align="left">Texto alineado a la izquierda</p>
justificación al centro: <p
align="center">Texto alineado al centro</p>
Atributos para fondos
bgcolor: especificamos un color de fondo para la página.
Ejemplo de fondo
background: sirve para indicar la colocación de una imagen como
fondo de la página.
<body background="fondo.jpg">
9. <HTML>
<HEAD>
<TITLE>
EJERCICIO 2
</TITLE>
</HEAD>
<BODY>
<CENTER> <S> <b> <I> HIMNO NACIONAL <BR>
DEL<BR>
ECUADOR <BR> </S> </I> </b>
</CENTER>
<p align=left> <pre>
<b> CORO </b>
Salve oh Patria, ¡mil veces! Oh Patria!
gloria a ti! Ya tu pecho rebosa
gozo y paz, y tu frente radiosa
más que el sol contemplamos lucir.
</p>
<p align=right>
<b> ESTROFA <br> </b>
Los primeros los hijos del suelo
que, soberbio; el Pichincha decora
te aclamaron por siempre señora
y vertieron su sangre por ti.
Dios miró y aceptó el holocausto,
y esa sangre fue germen fecundo
de otros héroes que, atónito, el mundo
vio en tu torno a millares surgir.
</p>
</PRE>
</BODY>
</HTML>
10. Las listas se definen de forma muy sencilla: se dice dónde empieza la
lista, dónde empieza cada punto y dónde acaba la lista. Las etiquetas que se
utilicen en cada caso deben aparecer al principio de línea, o al menos sin
texto por delante (sólo espacios o tabulaciones).Podemos recurrir a tres
tipos distintos de listas, cada una con una presentación diferente: no
numeradas, numeradas y listas de definiciones (glosarios).
Las listas se pueden anidar, es decir, en el lugar donde debería ir uno de los
términos de la lista se pone una nueva lista, que por supuesto no tiene
porqué ser del mismo tipo.
12. La etiqueta <MARQUEE> </MARQUEE> crea una marquesina cuyo
contenido se desplaza. Por defecto, ocupa todo el ancho de la
pantalla, tiene una línea de altura y el texto se mueve lentamente de
derecha a izquierda.
Los atributos WIDHT y HEIGHT permiten controlar el ancho y el alto
de la marquesina y pueden expresarse en pixeles o porcentualmente.
El atributo ALIGN permite alinear el texto que rodea la marquesina, y
puede tener los siguientes valores: top (arriba), middle (centrado)
bottom (abajo). Los atributos HSPACE y VSPACE definen la
separación horizontal y vertical del texto con los bordes de la
marquesina:
<marquee width="50%" height="60" align="bottom">
... texto ...
</marquee>
13. El color de fondo puede establecerse con el atributo BGCOLOR o, utilizando el
atributo STYLE, podemos establecer cualquier propiedad, de manera similar al
resto de las etiquetas HTML:
<marquee style="...propiedades...">
... texto ...
</marquee>
DIRECTION se utiliza para modificar la dirección hacia la que se dirige el texto.
Puede ser left (el valor por defecto), right, up o down:
<marquee direction="right">
... texto ...
</marquee>
Con el atributo SCROLLDELAY se define el tiempo entre cada movimiento
expresado en milisegundos:
<marquee scrolldelay="300">
... texto ...
</marquee>
Con SCROLLAMOUNT controlamos la cantidad de desplazamiento del texto en cada movimiento
de avance. Cuanto mayor es el número, más rápido avanza:
Por último, el atributo BEHAVIOR (comportamiento) sirve para definir de que manera se va a
efectuar el desplazamiento
14. La etiqueta que utilizaremos para insertar una imagen es <img>
(image).
Esta etiqueta no posee su cierre correspondiente y en ella
hemos de especificar obligatoriamente el paradero de nuestro
archivo gráfico mediante el atributo src (source).
La sintaxis queda entonces de la siguiente forma:
<img src=“nombre del archivo.extensión">
15. <html>
<head>
<title>
</title>
</head>
<body background="b.jpg" >
<FONT COLOR="green">
<MARQUEE direction=rigth ><CENTER><h1>UNIVERSIDAD CENTRAL DEL
ECUADOR</h1></CENTER></MARQUEE>
<MARQUEE><CENTER><h2>FACULTAD DE FILOSOFIA
</h2></CENTER></MARQUEE>
<MARQUEE><CENTER><h3>ESCUELA DE CIENCIAS
EXACTAS</h3></CENTER></MARQUEE>
<MARQUEE><CENTER><h1>CARRERA DE
INFORMATICA</h1></CENTER></MARQUEE>
</BODY>
</HTML>
16. <html>
<head>
<title>
LA CIUDAD DE QUITO
</title>
</head>
<body bgcolor="GRAY" TEXT="green">
<CENTER><h1>QUITO</h1></CENTER>
<HR>
<CENTER><IMG SRC="QUITO.JPG"></CENTER>
</body>
</html>
17. La etiqueta bgsound incorpora sonidos de fondo en una
página web, sonidos que se ejecutan automáticamente al
cargarse la página. Es una etiqueta propietaria de
Microsoft, por lo que sólo es interpretada por Internet
Explorer, admitiendo los formatos de audio MID y
WAV, aunque generalmente también acepta AU y MP3, en
versiones actuales del nevagador o mediante plugins de uso
general.
<BGSOUND SRC="imagine.mid" LOOP=INFINITE>
18. La etiqueta <embed> es la que se utiliza para insertar archivos de
vídeo. Puede incluirse la etiqueta de cierre, pero en realidad no es
necesaria, ya que entre las etiquetas <embed> y </embed> no hay
que insertar nada.
A través del atributo src hay que especificar la ruta y el nombre del
archivo de vídeo.
Los videos insertados a través de esta etiqueta se reproducen
automáticamente al cargarse la página, y se reproducen solamente
una vez. Esto puede cambiarse a través de los atributos autostart y
loop.
20. DIRECTIVAS TIPO FUNCIÓN
<br> abierta Salto de línea
<center> cerrado centrado
<p> cerrado Elabora párrafo
<b> cerrado Negrita
<strong> cerrado negrita
<I> cerrado Cursiva
<U> cerrado subrayado
<S> cerrado tachado
<marquee> Cerrado Movimiento a títulos
e imágenes
< font size> cerrado Tamaño de la letra
<font face> cerrado Tipo de letra
<font color> cerrado Color de la letra
< body bgcolor cerrado Color del fondo