GUÍA TEMÁTICA PARA EL EXAMEN DE CUARTO BIMESTRE
2018-2019
1.- Deberás estudiar todas las guías que se dieron durante el ciclo escolar
2.- Debes estudiar la estructura de HTML
3.- Debes estudiar todas las etiquetas que se vieron durante el bimestre
4.- Deberás aplicar las etiquetas en un programa de HTML
5.- Describe que es un navegador y ejemplos de navegadores
6.- Describe que es un buscador y menciona los motores de búsqueda que conozcas
7.- De que otra forma se les conoce a las bases de datos en la red
8.- Define sitio web y página web
9.- Ejemplos de una página web y ejemplos de sitio web
10.- Características de basura digital o cibernética
11.- Autores de la evolución histórica de las computadoras y menciona su invento por cada inventor
12.- Características de las generaciones de computadoras
13.- Describe la memoria RAM
14.- Describe la memoria ROM
15.- Que es un Hacker, Malware y Ciberacoso
16.- Que es la URL, TCP, HTML y HTTP
17.- Menciona cada uno de los elementos de una dirección web
18.- Es el enunciado del problema, el cual debe ser claro y completo.
19.- Se lleva a cabo después de terminado el programa y se detectan cambios y ajustes al programa para que siga trabajando de manera correcta.
20.- Es la base para comprender, analizar y proponer soluciones a los problemas de la lógica de programación
21.- Es la documentación que se le proporciona al usuario final, es una guía que indica el usuario como navegar en el programa, presentando todas las pantallas y menús que se va a encontrar
22.- Verifica que al algoritmo antes de ser probado y antes de ser ejecutado con datos reales.
23.- Es una secuencia de pasos lógicos y ordenados finitos, con las cuales le damos solución a un problema determinado, los pasos deben ser secuenciales, definidos, debe tener un inicio y un fin.
24.- Son una serie de instrucciones detalladas en un código es decir en un lenguaje de programación a esta serie de instrucciones se le conoce como programa.
25.- Consiste en eliminar los errores que se hayan detectado durante la prueba, para dar paso a una solución adecuada y sin errores.
26.- Características de los diagramas Hipo:
27.- Características de los diagramas Nassi-Schneiderman
28.- Que un diagrama de flujo.
29.- Características que debes tomar en cuenta para saber la estructura de un algoritmo.
30.- Estudia la guia de kahoot
31. Los colores en html se representan en
32. El <head> se debe poner debajo de la etiqueta
33. Con que extensión se guarda un programa de HTML
34. Las etiquetas <body> …. </body> se deben colocar
35. ¿Qué etiqueta está comprendida entre <head> y </head>?
36. Los encabezados de <h1>…<h6>:
37. Las etiquetas <align="center">
38. El atributo align sirve para:
39. La etiqueta <ol> me sirve para
40. El atributo que puede establecerse en el body para poner una imagen de fondo es:
41. El color de fondo de una página del documento se especifica en el:
42. La etiqueta marquee me sirve
43. A un hiperenlace también se le puede nombrar
44. La etiqueta <table> … </table> me sirve para:
45. ¿Cuál es el atributo en tablas para poner filas?
46. La etiqueta que hace que el texto se muestre en cursiva es:
47. HTLM es:
48. ¿Que son las etiquetas o Tags?
49. La etiqueta para definir un término dentro de una página de html es:
50. ¿Cuál es la etiqueta para realizar un hipervínculo?
51. La etiqueta que hace que el texto se muestre en negrita es:
52. La etiqueta para poner subrayado es:
53. Mediante de cuál atributo puede establecerse color de fondo del documento
54. La etiqueta para separar bloques dentro de una página es:
55. Realiza el siguiente programa en html: Las opciones del menu debe ser hipervinculos
INFORMÁTICA 4°
Translate
viernes, 12 de marzo de 2021
miércoles, 10 de marzo de 2021
CLASE 60 PROGRAMA
Mares de América
Los océanos y mares son el hábitat de miles de especies y el medio por el
cual se desplazan los buques. La extensión de los mismos es inmensa y mucho
mayor que la superficie terrestre y aun comprenden una gran cantidad de
misterios.
Mares y oceanos de México
1. Océano
Pacífico
2. Golfo de
México
3. Mar Caribe
4- Golfo de
california
martes, 9 de marzo de 2021
CLASE 59 TABLAS
Fin en mente: Realizar un programa en HTML donde se apliquen diferentes formas de tablas
<html>
<head>
<title Frutas> </title>
<table bgcolor="skyblue" border="5" width=80%">
<tr>
<td colspan="3">
<p align="center"> <font face="arial" color="blue"> Frutas
</p> </font>
</td>
</tr>
<tr>
<td> <p align="cenetr"><font face="verdana" color="black"> Frutas Citricas
<ol>
<li type="circle"> Mandarina
<li type="circle"> Naranja
<li type="circle"> Lima
<li type="circle"> Toronja
</ol> </p> </font> </td>
<td> <p align="center"><font face="arial" color="green"> Frutas Silvestres
<ul>
<li type="disc"> Uva </li>
<li type="disc"> Kiwi </li>
<li type="disc"> Fresa </li>
<li type="disc"> Mora </li>
</ul> </p> </font> </td>
<td> <p align="center"><font face="calibri" color="yellow"> Frutas Tropicales
<ul>
<li type="square"> Coco </li>
<li type="square"> Mango </li>
<li type="square"> Platano </li>
<li type="square"> Sandia </li>
</p> </font> </td>
</ul>
</tr>
</table>
</body>
</html>
<html>
<head>
<title Frutas> </title>
<table bgcolor="skyblue" border="5" width=80%">
<tr>
<td colspan="3">
<p align="center"> <font face="arial" color="blue"> Frutas
</p> </font>
</td>
</tr>
<tr>
<td> <p align="cenetr"><font face="verdana" color="black"> Frutas Citricas
<ol>
<li type="circle"> Mandarina
<li type="circle"> Naranja
<li type="circle"> Lima
<li type="circle"> Toronja
</ol> </p> </font> </td>
<td> <p align="center"><font face="arial" color="green"> Frutas Silvestres
<ul>
<li type="disc"> Uva </li>
<li type="disc"> Kiwi </li>
<li type="disc"> Fresa </li>
<li type="disc"> Mora </li>
</ul> </p> </font> </td>
<td> <p align="center"><font face="calibri" color="yellow"> Frutas Tropicales
<ul>
<li type="square"> Coco </li>
<li type="square"> Mango </li>
<li type="square"> Platano </li>
<li type="square"> Sandia </li>
</p> </font> </td>
</ul>
</tr>
</table>
</body>
</html>
sábado, 6 de marzo de 2021
CLASE 59 TABLAS EN HTML
Fin en mente: Aplicar en un programa de HTML la etiqueta de TABLAS <table> </table>
Fila <tr>
Es necesario insertar las etiquetas <tr> y </tr> por cada
una de las filas de la tabla. Estas etiquetas deberán insertarse entre las etiquetas <table> y </table>.
Por ejemplo, para crear una tabla con cinco filas escribiríamos:
<table>
<tr>...</tr>
<tr>...</tr>
<tr>...</tr>
<tr>...</tr>
<tr>...</tr>
</table>
Columna o celda <td>
Para crear una tabla no basta con especificar el número de filas, es
necesario también especificar el número de columnas.
Una celda es el resultado de la intersección entre una fila y una
columna, por lo que podremos especificar el número de celdas por fila, que
equivale a especificar el número de columnas por fila.
Es necesario insertar las etiquetas <td> y </td> por cada
una de las celdas que compongan cada una de las filas de la tabla. Por lo
tanto, habrá que insertar esas etiquetas entre las etiquetas <tr> y
</tr>.
Además de los atributos específicos de cada celda o
línea, las tablas pueden ser adicional mente formateadas a partir de los
atributos que nos ofrece la propia etiqueta <table>. He aquí aquellos que
pueden parecernos en un principio importantes:
align
|
Alinea horizontalmente la tabla con respecto a su entorno.
|
background
|
Nos permite colocar un fondo para la tabla a partir de un enlace a una
imagen.
|
bgcolor
|
Da color de fondo a la tabla.
|
border
|
Define el número de pixels del borde principal.
|
bordercolor
|
Define el color del borde.
|
cellpadding
|
Define, en pixels, el espacio entre los bordes de la celda y el
contenido de la misma.
|
cellspacing
|
Define el espacio entre los bordes (en pixels).
|
height
|
Define la altura de la tabla en pixels o porcentaje.
|
width
|
Define la anchura de la tabla en pixels o porcentaje.
|
Los atributos que definen las dimensiones, height y width, funcionan de una manera análoga a la de las celdas tal y como ya lo hemos visto. Contrariamente, el atributo align no nos permite justificar el texto de cada una de las celdas que componen la tabla, sino más bien, justificar la propia tabla con respecto a su entorno.
Vamos a poner tres ejemplos de alineado de tablas, centradas, alineadas
a la derecha y a la izquierda.
|
||||||||
Los atributos cellpading y cellspacing nos
ayudaran a dar a nuestra tabla un aspecto más estético. En un principio puede
parecernos un poco confuso su uso pero un poco de practica será suficiente para
hacerse con ellos.
En la siguiente imagen podemos ver gráficamente el significado de estos
atributos
EJEMPLO DE TABLAS
<html>
<head>
<title> Tabla 1
</title>
</head>
<body>
<h3> Esto es una tabla con 3 columnas y una fila </h3>
<TABLE
BORDER="5" WIDTH="300" bgcolor="pink">
<TD WIDTH=100> <p
align="center"> <font face="arial"
color="green">
Hola
</TD> </p> </font>
<TD WIDTH=100> <p
align="center"> <font face="arial" color="green">
Hola
</TD> </p> </font>
<TD WIDTH=100> <p
align="center"> <font face="arial"
color="green">
Hola
</TD> </p> </font>
</TABLE>
<h3> Esto es una tabla con 3 columnas y 2 filas </h3>
<TABLE
BORDER="2" WIDTH="300">
<TR>
<TD WIDTH=100
bgcolor="yellow"> <p align="center"> <font
face="arial" color="blue"> 1
</TD> </p>
</font>
<TD WIDTH=100
bgcolor="yellow"> <p align="center"> <font
face="arial" color="blue">2
</TD> </p>
</font>
<TD WIDTH=100
bgcolor="yellow"> <p align="center"> <font
face="arial" color="blue">3
</TD> </p>
</font>
</TR>
<TR>
<TD WIDTH=100
bgcolor="sky blue"> <p align="center"> <font
face="arial" color="blue">4
</TD> </p>
</font>
<TD WIDTH=100
bgcolor="sky blue"> <p align="center"> <font
face="arial" color="blue">5
</TD> </p>
</font>
<TD WIDTH=100
bgcolor="sky blue"> <p align="center"> <font
face="arial" color="blue">6
</TD> </p>
</font>
</TR>
</TABLE>
<h3> Esto es una tabla combinada
con columnas y filas </h3>
<table
width="575" border="2" cellspacing="2">
<tr align="center"
valign="middle">
<th colspan="4"> <font face="arial"
color="blue"> DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE</th>
</tr>
<tr align="center"
valign="middle">
<th rowspan="2"> <font face="arial" color="blue">
DIFERENCIAS</th>
<th colspan="2"> <font face="arial"
color="blue">PERRO</th>
<th rowspan="2"> <font
face="arial" color="blue"> HOMBRE</th>
</tr>
<tr align="center"
valign="middle">
<th>
<font face="arial">PEQUEÑO</th>
<th>
<font face="arial">GRANDE</th>
</tr>
<tr align="center"
valign="middle">
<td> <font
face="arial">Duración crecimiento</td>
<td>10 meses</td>
<td>18 a 24
meses</td>
<td>16 años</td>
</tr>
<tr align="center"
valign="middle">
<td> <font
face="arial">Tiempo de gestación</td>
<td colspan="2">58 a 63 días</td>
<td>9 meses</td>
</tr>
<tr align="center"
valign="middle">
<td> <font
face="arial">Duración de vida del
pelo/cabello</td>
<td colspan="2">1 año</td>
<td>2 a 7 años</td>
</tr>
</table>
</body>
</html>
viernes, 5 de marzo de 2021
CLASE 58 LISTAS EN HTML
Fin en mente: Realizar un programa en HTML para aplicar diferentes estilos de viñetas por medio de listas ordenadas y listas con diferentes estilos de viñeta
<html>
<html>
<head>
<title> Listas </title>
</head>
<body background="fondo-tecnológico-668980 (1).jpg">
<ol>
<p> <font face="verdana" size="8" color="blue"> Canciones romanticas </p>
<li value="5"> Monitor </li>
<li> Liston de tu pelo </li>
<li> Ni que estuvieras tan buena </li> </font>
</ol>
<ul>
<p> <font face="arial" size="8" color="brown"> Canciones de banda </p>
<li type="circle">Fuiste mia </li>
<li type="circle"> Broche de oro </li>
<li type="circle"> Ya te perdi la fe </li> </font>
</ul>
<ul>
<p> <font face="algerian" size="8" color="purple"> Canciones de reggeton </p>
<li type="square">Candy </li>
<li type="square"> Hasta el amanecer </li>
<li type="square"> Borro casette </li> </font>
</ul>
<ul>
<p> <font face="calibri" size="8" color="yellow"> Canciones de salsa </p>
<li type="disc"> Un monton de estrellas </li>
<li type="disc"> Porque sera </li>
<li type="disc"> Me tengo que ir </li> </font>
</ul>
<dt>
<p> <font face="calibri" size="8" color="yellow"> Informatica
<dd> Es la ciencia que se encarga del proceso automatizado de la informacion por medio de un ordenador
</p>
</font>
</dd>
</dt>
</body>
</html>
martes, 2 de marzo de 2021
CLASE 56 Y 57 SEPARADORES Y MARQUESINAS
Fin en mente: Aplicar en una página web la etiqueta <hr> para separar bloques y la etiqueta <marquee> para darle movimiento a un texto
Para separar un texto de otro o un párrafo de otro podemos utilizar una línea horizontal de un tamaño o un grosor determinado por nosotros. Esa franja la escribimos con la etiqueta <hr>. La contrario que muchas etiquetas html, ésta no necesita ser cerrada. Sólo con escribir la etiqueta anterior ya la escribimos.
La etiqueta <hr>, como muchas otras etiquetas, puede variar de aspecto dependiendo de una serie de caracteres o parámetros que podemos predefinir. Por ejemplo, podemos definir su grosor mediante el parámetro size.
Para escribir este parámetro en la etiqueta escribiremos “size=x”, siendo “x” el número del grosor de la franja. A continuación te vamos a ofrecer dos ejemplos de franjas con diferentes grosores, siendo la primera 10 y la segunda dos. La diferencia es abismal
<hr size="20" />
<hr size="2" />
Para separar un texto de otro o un párrafo de otro podemos utilizar una línea horizontal de un tamaño o un grosor determinado por nosotros. Esa franja la escribimos con la etiqueta <hr>. La contrario que muchas etiquetas html, ésta no necesita ser cerrada. Sólo con escribir la etiqueta anterior ya la escribimos.
La etiqueta <hr>, como muchas otras etiquetas, puede variar de aspecto dependiendo de una serie de caracteres o parámetros que podemos predefinir. Por ejemplo, podemos definir su grosor mediante el parámetro size.
Para escribir este parámetro en la etiqueta escribiremos “size=x”, siendo “x” el número del grosor de la franja. A continuación te vamos a ofrecer dos ejemplos de franjas con diferentes grosores, siendo la primera 10 y la segunda dos. La diferencia es abismal
<hr size="20" />
<hr size="2" />
A continuación vamos a escribir una franja de 75% de ancho: <hr width=75%"/>
Muchos navegadores hacen esta franja con una sombra exterior que transforma la franja en tres dimensiones. Si quieres que la franja sea simple, sin sombrita deberás escribir el parámetro “noshade”.
También podemos predefinir el color que le queremos dar a la franja con el parametro "color". Es muy sencillo. Por ejemplo, si queremos que nuestra franja sea de color rojo sólo debemos ponerle la etiqueta: <hr color="#FF0000"/>.
Por último, puedes hacer que la franja quede alineada a un lado, a otro, o al centro del párrafo mediante el parámetro que ya vimos con anterioridad: “align”. “align = center” para el centro, “align = right” para la derecha y “align = left” para la izquierda.
Como ejemplos finales vamos a hacer dos franjas. La primera va a ser una franja de grosor 3, de un ancho del 50% y alineada al centro.
<hr size=3 width= 50% align=center/>
La siguiente va a ser una franja de grosor 2, de ancho 80%, sin sombra y alineada a la derecha.
<hr size=2 width=80% noshade=“noshade” align= right />
También podemos predefinir el color que le queremos dar a la franja con el parametro "color". Es muy sencillo. Por ejemplo, si queremos que nuestra franja sea de color rojo sólo debemos ponerle la etiqueta: <hr color="#FF0000"/>.
Por último, puedes hacer que la franja quede alineada a un lado, a otro, o al centro del párrafo mediante el parámetro que ya vimos con anterioridad: “align”. “align = center” para el centro, “align = right” para la derecha y “align = left” para la izquierda.
Como ejemplos finales vamos a hacer dos franjas. La primera va a ser una franja de grosor 3, de un ancho del 50% y alineada al centro.
<hr size=3 width= 50% align=center/>
La siguiente va a ser una franja de grosor 2, de ancho 80%, sin sombra y alineada a la derecha.
<hr size=2 width=80% noshade=“noshade” align= right />
La etiqueta html
<marquee>
se utiliza para insertar un área de texto en movimiento. También se la conoce como marquesina.Atributos
El movimiento, la dirección de desplazamiento, la velocidad del mismo,…todo es configurable gracias a los siguientes atributos:
align: Este atributo nos indicará si el texto dentro de la etiqueta se alineará en la zona alta del marquee ("top"), en el medio ("middle") o en la parte baja ("bottom").
direction: Sirve para definir la dirección del movimiento: "left" para la izquierda, "right" para la derecha, "top" para arriba y "down" para abajo.
behavior: Gracias a este atributo podemos dar nuevos efectos a la marquesina. Si no especificamos este atributo, el texto se moverá de forma circular en el sentido que le hayamos marcado. Con behavior="scroll" conseguiremos el mismo efecto: el texto se moverá circularmente.
Con behavior="slide" haremos que el texto se detenga al llegar al final de la marquesina. Y con el behavior="alternate" el texto irá y volverá de un lado a otro de la marquesina.
align: Este atributo nos indicará si el texto dentro de la etiqueta se alineará en la zona alta del marquee ("top"), en el medio ("middle") o en la parte baja ("bottom").
direction: Sirve para definir la dirección del movimiento: "left" para la izquierda, "right" para la derecha, "top" para arriba y "down" para abajo.
behavior: Gracias a este atributo podemos dar nuevos efectos a la marquesina. Si no especificamos este atributo, el texto se moverá de forma circular en el sentido que le hayamos marcado. Con behavior="scroll" conseguiremos el mismo efecto: el texto se moverá circularmente.
Con behavior="slide" haremos que el texto se detenga al llegar al final de la marquesina. Y con el behavior="alternate" el texto irá y volverá de un lado a otro de la marquesina.
bgcolor
- Establece el color de fondo, puede utilizarse el nombre, o el valor hexadecimal del color.
direction
- Establece la dirección en la que el texto contenido se desplazará. Los valores posibles son left (para moverse hacia la izquierda), right (para moverse a la derecha), up (hacia arriba) y down (hacia abajo). Si no se especifica este atributo, por defecto será left.
height
- Establece la altura de la etiqueta en pixeles, o en un valor porcentual.
hspace
- Establece el margen horizontal.
loop
- Establece el número de veces que la marquesina realizará el desplazamiento. Si no se especifica esta propiedad, por defecto es -1, lo que quiere decir que la marquesina se desplazará continuamente.
scrollamount
- Establece el valor de movimiento para cada intervalo en pixeles. Por defecto su valor es 6.
scrolldelay
- Establece el intervalo entre cada desplazamiento, en milisegundos. El valor por defecto es 85. Nota: Cualquier valor inferior a 60 será ignorado, (puesto que el valor minimo es 60) y se establecerá 60 en su lugar. Salvo que se especifique
truespeed.
truespeed
- Por defecto, si los valores de
scrolldelay son inferiores a 60 serán ignorados. Pero si truespeed está presente, esos valores inferiores a 60 serán aceptados.
vspace
- Establece el margen vertical en pixeles o en un valor porcentual.
width
- Establece el ancho de la etiqueta en pixeles o un valor porcentual.
Eventos
onbounce
- Este evento se lanza cuando la marquesina llegó al final del desplazamiento. Ésto solo se activa cuando el atributo
behavior
está establecido enalternate
. onfinish
- Este evento se lanza cuando la marquesina repitió el desplazamiento la cantidad de veces establecidas en el atributo
loop
. El evento se lanza solo si el atributoloop
tiene un valor mayor a 0. onstart
- Este evento se lanza cuando la marquesina comienza su desplazamiento.
Metodos
- start
- Comienza el desplazamiento de la marquesina.
- stop
- Para el desplazamiento de la marquesina
Ejemplos
<html>
<head>
<title> separadores y marquesinas </title>
</head>
<body background="file:///C|/Users/prepa1/Desktop/images (1).jpg">
<marquee bgcolor="red" scrollamount="100 direction="right">
<p align="center"> <font face="verdana" size="10"> Mi nombre es: </p> </font> </marquee>
<p align="center"> <font face="verdana" size="10"> Guiomar </p> </font>
<hr size="20" color="yellow">
<marquee bgcolor="red" scrolldelay="100 direction="left">
<p align="center"> <font face="verdana" size="10"> Mi deporte favorito es: </p> </font> </marquee>
<p align="center"> <font face="verdana" size="10"> Squash </p> </font>
<hr size="8" color="green">
<marquee width="50%" bgcolor="red" scrolldelay="100 direction="left">
<p align="center"> <font face="verdana" size="10"> Mi snack favorito es: </p> </font> </marquee>
<p align="center"> <font face="verdana" size="10"> Papas a la francesa </p> </font>
<hr width="80%" color="black">
<marquee><font face="verdana" size="10"> Este texto se mueve de derecha a izquierda </font></marquee>
<marquee direction="up"><font face="verdana" size="10"> Este texto se mueve de abajo hacia arriba </font></marquee>
<marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid">
<marquee behavior="alternate"> <font face="verdana" size="10">
Este texto rebotará dentro de la marquesina.
</font> </marquee>
</marquee>
</body>
</html>
sábado, 27 de febrero de 2021
CLASE 55 PROGRAMA CON HIPERVINCULOS
Fin en mente: Realizar un programa de HTML para que el programa muestra en pantalla un link en una página web, con texto y con imágenes
<HTML>
<head>
<title> hipervinculo </title>
</head>
<body bgcolor="purple">
<br> <a href="www.google.com"> Este link me lleva a la pagina de google </a> </br>
<br> <a href="www.instagram.com"> Va a la pagina de instagram </a> </br>
<br> <a href="www.hotmail.com"> Este link me lleva a hotmail </a> </br>
<font face="arial" size="14"> Los siguentes links son con imagenes </font>
<br> <a href="www.netflix.com"> <img src="/Users/Guest/Desktop/images.jpeg"> </br> </a>
<br> <a href="www.facebook.com"> <img src="/Users/Guest/Desktop/images.png"> </br> </a>
<br> <a href="www.twitter.com"> <img src="/Users/Guest/Desktop/images-1.png"> </br> </a>
</body>
</HTML>
<HTML>
<head>
<title> hipervinculo </title>
</head>
<body bgcolor="purple">
<br> <a href="www.google.com"> Este link me lleva a la pagina de google </a> </br>
<br> <a href="www.instagram.com"> Va a la pagina de instagram </a> </br>
<br> <a href="www.hotmail.com"> Este link me lleva a hotmail </a> </br>
<font face="arial" size="14"> Los siguentes links son con imagenes </font>
<br> <a href="www.netflix.com"> <img src="/Users/Guest/Desktop/images.jpeg"> </br> </a>
<br> <a href="www.facebook.com"> <img src="/Users/Guest/Desktop/images.png"> </br> </a>
<br> <a href="www.twitter.com"> <img src="/Users/Guest/Desktop/images-1.png"> </br> </a>
</body>
</HTML>
Suscribirse a:
Entradas (Atom)