I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
1. Confeccione una página con las marcas mínimas que debe tener y en el cuerpo de la misma disponga su nombre y apellido. <html> <head> </head> <body> Rodriguez Pablo </body> </html> 2. Confeccionar una página HTML que muestre su nombre y apellido y en la siguiente línea los nombres de sus padres separados por un guión. <html> <head></head> <body> Diego Rodriguez. <br> Ana - Eduardo </body> </html> 3. Confeccione una página que muestre en un párrafo datos referentes a sus estudios y en otro párrafo su nombre y mail. <html> <head> </head> <body> <p> Colegio primario: Enet Nro1.<br> Colegio secundario: General Laprida.<br> Estudios universitarios: Universidad del Cabo. </p> <p> Nombre:Rodriguez pablo.<br> Mail: prodriguez@gmail.com </p> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
</body> </html> 4. Confeccionar el titular de un periódico con un título de nivel 1. Luego definir dos títulos de segundo nivel con los textos (Noticias políticas y Noticias deportivas), en cada una de estas secciones definir dos titulares de tercer nivel con un párrafo cada una. Al final de la página mostrar un título de cuarto nivel con el nombre de la empresa propietaria del periódico. <html> <head> </head> <body> <h1>Belgrano sale campeón nuevamente.</h1> <h2>Noticias políticas.</h2> <h3>Asumen sus funciones los diputados y senadores.</h3> <p> El próximo lunes asumen sus funciones los nuevos diputados y senadores elegidos por el pueblo el més pasado. Al acto lo presidirá el gobernador junto con todos sus ministros.<br> Se espera que los temas pendientes puedan ser resueltos prontamente. </p> <h3>Destitución del intendente de General Paz.</h3> <p> Luego de varias sesiones del consejo deliberante de General Paz el intendente fue destituido por una incorrecta asignación de partidas presupuestarias.<br> Se espera que el mes próximo se elija nuevo intendente. </p> <h2>Noticias deportivas</h2> <h3>Belgrano nuevamente triunfa.</h3> <p> En un partido vibrante el equipo celeste se queda nuevamente con la copa. El resultado final de 2 a 1 no denota la ventaja real que existió en el campo de juego.<br> Se espera la llegada del equipo al aeropuerto al mediodía. </p> <h3>Convocatoria de nuevos jugadores a la selección.</h3> <p> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
El director técnico llamo a nuevos jugadores para que se incorporen a la selección nacional.<br> Se espera que con los dos delanteros nuevos se reviertan los resultados negativos.<br> El mes próximo se enfrentará a un combinado de Europa. </p> <h4>Propiedad:La vanguardia digital.</h4> </body> </html> 5. Confeccionar una página que muestre la definición de tres palabras. Aplicar el elemento strong a cada palabra previo a su definición. Luego agregar el elemento em a una o a un conjunto de palabras dentro de la definición. <html> <head> </head> <body> <p><strong>PHP</strong>: es un lenguaje de programación usado generalmente para la creación de contenido para sitios web. PHP es un acrónimo recurrente que significa <em>"PHP Hypertext Pre-processor"</em></p> <p><strong>JSP</strong>: en el campo de la Informática, es una tecnología para crear aplicaciones web. Es un desarrollo de la compañía Sun Microsystems, y su funcionamiento se basa en <em>scripts</em>, que utilizan una variante del lenguaje <em>java</em>.</p> <p><strong>ASP</strong>: es una tecnología del lado servidor de Microsoft para páginas web generadas dinámicamente, que ha sido comercializada como un anexo a <em>Internet Information Server</em> (IIS).</p> </body> </html> 6. Confeccionar una página principal con dos hipervínculos a las páginas pagina2.html y pagina3.html. Luego en las dos páginas secundarias disponer hipervínculos a la página principal <html> <head> </head> <body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<h1>Blog de lenguajes de programación.</h1> <a href="pagina2.html">Lenguaje PHP</a> <br> <a href="pagina3.html">Lenguaje JavaScript</a> </body> </html> ______________________________________ <html> <head> </head> <body> <h1>PHP</h1> <a href="pagina1.html">Retornar.</a> </body> </html> ______________________________________ <html> <head> </head> <body> <h1>JavaScript</h1> <a href="pagina1.html">Retornar.</a> </body> </html> 7. Confeccionar una página que contenga un hipervínculo a un periódico (indicar sólo el nombre de dominio del periódico). Disponer además un segundo hipervínculo a una página determinada de ese periódico. <html> <head> </head> <body> <a href="http://www.clarin.com.ar">Diario Argentino Clarín</a> <br> <a href="http://www.clarin.com/shared/v8/ayuda-clarin/index.html">Seccion de ayuda del diario Clarín</a> </body> </html> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
8. Desarrollar una página que muestre dos imagenes llamadas foto2.jpg y foto3.jpg, las mismas se encuetran almacenadas en el servidor en la misma carpeta donde se almacenará la página que usted desarrollará. Disponer un título a cada imagen. <html> <head> </head> <body> <h1>Geometría Generativa (Obra 1)</h1> <img src="foto2.jpg" alt="Cuadrados amarillos"> <h1>Geometría Generativa (Obra 2)</h1> <img src="foto3.jpg" alt="Cuadrados rojos"> </body> </html> 9. Crear tres páginas con una foto cada una (foto1.jpg, foto2.jpg y foto3.jpg) luego al ser presionada avanzar a la siguiente página, es decir de la pagina1.html llamar a la pagina2.html, de la pagina2.html pasar a la pagina3.html y de ésta a la primera. Las imágenes se encuentran en una carpeta llamada imagenes que depende directamente de la raiz del sitio. <html> <head> </head> <body> <a href="pagina2.html"><img src="/imagenes/foto1.jpg" alt="Pintura Geométrica"> </a> </body> </html> _________________________________________________ <html> <head> </head> <body> <a href="pagina3.html"><img src="/imagenes/foto2.jpg" alt="Pintura Geométrica"> </a> </body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
</html> _____________________________________________ <html> <head> </head> <body> <a href="pagina1.html"><img src="/imagenes/foto3.jpg" alt="Pintura Geomﾃｩtrica"> </a> </body> </html> 10. Confeccionar una pﾃ｡gina que muestre enlaces a distintos blog. Agruparlos bajo dos tﾃｭtulos que muestren los mismos enlaces, el primero "Hacer la apertura en otra ventana" y el segundo "Hacer la apertura en el mismo navegador". <html> <head> </head> <body> <h1>Blog de Actualidad.</h1> <h2>Apertura en otra ventana.</h2> <p> <a href="http://www.microsiervos.com" target="_blank">Microsiervos</a> <br> <a href="http://www.mangasverdes.es" target="_blank">Mangas Verdes</a> <br> <a href="http://alt1040.com" target="_blank">Alt1040</a> <br> </p> <h2>Apertura en la misma ventana.</h2> <p> <a href="http://www.microsiervos.com">Microsiervos</a> <br> <a href="http://www.mangasverdes.es">Mangas Verdes</a> <br> <a href="http://alt1040.com">Alt1040</a> <br> </p> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
</body> </html> 11. Una empresa que vende pizzas tiene 3 ofertas. Las mismas son ( 1- 1 muzzarella y una bebida cola a 5 pesos, 2- 2 muzzarellas a 6 pesos y 3 - 4 muzarrellas a 10 pesos). Confeccionar una página que disponga tres hipervínculos a cada una de esas ofertas. Al ser presionadas abrir el cliente de correo y enviar la promoción correspondiente. En el título indicar si se trata de la promoción 1, 2 o 3. En el cuerpo del mensaje pedir que ingrese la dirección y teléfono de la persona que hace el pedido. <html> <head> </head> <body> <h1>Pizzas online</h1> <h2>Promoción 1</h1> <p>1 Muzzarella.<br> 1 bebida cola<br> Costo: $5<br> <a href="mailto:pizzasya@gmail.com?subject=Promoción 1&body=Ingrese aquí su dirección y teléfono:">Solicitar.</a> </p> <h2>Promoción 2</h1> <p>2 Muzzarellas.<br> Costo: $6<br> <a href="mailto:pizzasya@gmail.com?subject=Promoción 2&body=Ingrese aquí su dirección y teléfono:">Solicitar.</a> </p> <h2>Promoción 3</h1> <p>3 Muzzarella.<br> Costo: $10<br> <a href="mailto:pizzasya@gmail.com?subject=Promoción 3&body=Ingrese aquí su dirección y teléfono:">Solicitar.</a> </p> </body> </html> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
12. Disponer una serie de hipervínculos sobre noticias del día. Enlazar los hipervínculos con anclas que se encuentran más abajo en la misma página. <html> <head> </head> <body> <h1>Noticias del día.</h1> <a href="#noticia1">Noticia 1</a><br> <a href="#noticia2">Noticia 2</a><br> <a href="#noticia3">Noticia 3</a><br> <a href="#noticia4">Noticia 4</a><br> <a name="noticia1"></a> <h2>Noticia 1</h2> <p> Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. </p> <a name="noticia2"></a> <h2>Noticia 2</h2> <p> Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Esp: GREIDY CECILIA ARCE USMAN
1. 1. 1. 1.
2. 2. 2. 2.
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
</p> <a name="noticia3"></a> <h2>Noticia 3</h2> <p> Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. </p> <a name="noticia4"></a> <h2>Noticia 4</h2> <p> Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia Noticia 4. Esp: GREIDY CECILIA ARCE USMAN
2011
3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3. 3. Noticia 3. Noticia 3.
4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4. 4. Noticia 4. Noticia 4.
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. </p> </body> </html>
13. Disponer una serie de hipervínculos sobre noticias del día. Enlazar los hipervínculos con anclas que se encuentran en otra página. <html> <head> </head> <body> <h1>Noticias del día.</h1> <a href="pagina2.html#noticia1">Noticia 1</a><br> <a href="pagina2.html#noticia2">Noticia 2</a><br> <a href="pagina2.html#noticia3">Noticia 3</a><br> <a href="pagina2.html#noticia4">Noticia 4</a><br> </body> </html> ________________________________________ <html> <head> </head> <body> <a name="noticia1"></a> <h2>Noticia 1</h2> Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. Noticia 1. </p> <a name="noticia2"></a> <h2>Noticia 2</h2> <p> Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2.Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2.Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2.Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2.Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2. Noticia 2.Noticia 2. Noticia 2. </p> <a name="noticia3"></a> <h2>Noticia 3</h2> <p> Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. Noticia 3. </p> <a name="noticia4"></a> <h2>Noticia 4</h2> <p> Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. Noticia 4. </p> </body> </html> 14. Confeccione una lista ordenada con los tres países con mayor población del planeta. Disponer un título de segundo nivel y debajo de la lista la suma de habitantes de esos tres países enfatizado. <html> <head> </head> <body> <h2>Paises con mayor población</h2> <ol> <li>China (1300 millones)</li> <li>India (1080 millones)</li> <li>Estados Unidos (295 millones)</li> </ol> <p>Sumando estos tres paises tenemos millones</strong></p> </body> </html>
una
población
de
<strong>2675
15. Confeccionar una lista no ordenada que contenga hipervínculos a distintos periódicos que usted conoce. Agregar tantos item como periódicos conoce. <html> <head> </head> <body> <h2>Periódicos de Argentina.</h2> <ul> <li><a href="http://www.lanacion.com.ar">La Nación</a></li> <li><a href="http://www.clarin.com.ar">Clarín</a></li> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<li><a href="http://www.lavoz.com.ar">La voz del interior</a></li> </ul> </body> </html> 16. Confeccione una lista de definición de un conjunto de palabras que utilice en su ámbito laboral. <html> <head> </head> <body> <dl> <dt>Analista de sistemas</dt> <dd>Un analista, en la disciplina de la ingeniería del software, es aquel individuo que ejerce las tareas de análisis de los sistemas informáticos, con el fin de automatizarlos.</dd> <dt>Programador</dt> <dd>Un programador es un individuo que ejerce la programación, es decir, que escribe programas de ordenador. Los programadores también reciben el nombre de desarrolladores de software.</dd> <dt>Webmaster</dt> <dd>Es la persona responsable de un sitio web.</dd> </body> </html> 17. Confeccionar una lista no ordenada de lenguajes de programación. Luego disponer una lista ordenada con hipervínculos a sitios que tratan dichos lenguajes. <html> <head> </head> <body> <ul> <li>PHP <ol> <li><a href="http://www.vivaphp.com.ar">Viva PHP</a></li> <li><a href="http://www.phpadictos.com">PHP Adictos</a></li> <li><a href="http://www.php-hispano.net">PHP Hispano</a></li> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<li><a href="http://www.php.org.mx">PHP México</a></li> </ol> </li> <li>JavaScript <ol> <li><a href="http://www.gamarod.com.ar">Gamarod</a></li> <li><a href="http://www.htmlpoint.com/javascript/tutorial">HTML Point</a></li> </ol> </li> <li>C++ <ol> <li><a href="http://codigomaldito.blogspot.com">Código Maldito C++</a></li> <li><a href="http://www.arrakis.es/~rporcar">Club Builder</a></li> </ol> </li> </ul> </body> </html> 18. Confeccionar una tabla que muestre en la primer columna los nombre de distintos empleados de una compañia y en la segunda el sueldo bruto (la compañía tiene 4 empleados) <html> <head> </head> <body> <table border="1"> <tr> <td>Rodriguez Pablo</td><td>1700</td> </tr> <tr> <td>Lopez Ana</td><td>1950</td> </tr> <tr> <td>Gomez Luis</td><td>1473</td> </tr> <tr> <td>Menendez Carlos</td><td>1640</td> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
</tr> </table> </body> </html> 19. Confeccionar una tabla que muestre en la primer columna los nombre de distintos empleados de una compañía y en la segunda el sueldo bruto (la compañía tiene 4 empleados) Mostrar los textos 'Nombre del Empleado' y 'Sueldo Bruto' como primer fila de la tabla. <html> <head> </head> <body> <table border="1"> <tr> <th>Nombre del Empleado</th><th>Sueldo Bruto</th> </tr> <tr> <td>Rodriguez Pablo</td><td>1700</td> </tr> <tr> <td>Lopez Ana</td><td>1950</td> </tr> <tr> <td>Gomez Luis</td><td>1473</td> </tr> <tr> <td>Menendez Carlos</td><td>1640</td> </tr> </table> </body> </html> 20. Confeccionar una tabla que muestre en la primer columna los nombre de distintos empleados de una compañía y en la segunda el sueldo bruto (la compañía tiene 4 empleados) Disponer en la tabla un título representativo. <html> <head> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
</head> <body> <table border="1"> <caption>Listado de sueldos de la compañía xx</caption> <tr> <th>Nombre del Empleado</th><th>Sueldo Bruto</th> </tr> <tr> <td>Rodriguez Pablo</td><td>1700</td> </tr> <tr> <td>Lopez Ana</td><td>1950</td> </tr> <tr> <td>Gomez Luis</td><td>1473</td> </tr> <tr> <td>Menendez Carlos</td><td>1640</td> </tr> </table> </body> </html> 21. Confeccionar una tabla que muestre los nombres de periódicos y su nombre de dominio agrupados por países. En la primer columna disponer los nombre de países, expandir en fila de acuerdo a la cantidad de diarios de cada país. <html> <head> </head> <body> <table border="1"> <tr> <th rowspan="3">Argentina</th><td>La Nación</td><td><a href="http://www.lanacion.com.ar">www.lanacion.com.ar</a></td> </tr> <tr> <td>Clarín</td><td><a href="http://www.clarin.com.ar">www.clarin.com.ar</a></td> </tr> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<tr> <td>La voz del interior</td><td><a href="http://www.lavoz.com.ar">www.lavoz.com.ar</a></td> </tr> <tr> <th rowspan="3">España</th><td>El País digital</td><td><a href="http://www.elpais.es">www.elpais.es</a></td> </tr> <tr> <td>ABC</td><td><a href="http://www.abc.es">www.abc.es</a></td> </tr> <tr> <td>El Mundo</td><td><a href="http://www.elmundo.es">www.elmundo.es</a></td> </tr> <th rowspan="2">México</th><td>La Jornada</td><td><a href="http://www.jornada.unam.mx">www.jornada.unam.mx</a></td> </tr> <tr> <td>El Universal</td><td><a href="http://www.el-universal.com.mx">http://www.eluniversal.com.mx</a></td> </tr> </table> </body> </html> 22. Confeccionar una página que muestre en el elemento title el nombre de dominio del sitio. <html> <head> <title>www.htmlJORGE.com.co</title> </head> <body> <h1>Aprenda a crear páginas HTML fácilmente</h1> </body> </html>
Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
23. Confeccionar un página que muestre dos tablas. Luego comentar la segunda y ver el resultado. <html> <head> </head> <body> <h2>Año 2006</h2> <table border="1"> <tr> <th rowspan="4">Recursos</th><th colspan="4">Facturación de los últimos tres meses</th> </tr> <tr> <td>Discos Duros</td><td>23000</td><td>27200</td><td>26000</td> </tr> <tr> <td>CPU</td><td>73000</td><td>67300</td><td>51000</td> </tr> <tr> <td>Monitores</td><td>53000</td><td>72000</td><td>88000</td> </tr> </table> <!-<h2>Año 2007</h2> <table border="1"> <tr> <th rowspan="4">Recursos</th><th colspan="4">Facturación de los últimos tres meses</th> </tr> <tr> <td>Discos Duros</td><td>43000</td><td>29100</td><td>18000</td> </tr> <tr> <td>CPU</td><td>78000</td><td>53400</td><td>61000</td> </tr> <tr> <td>Monitores</td><td>73000</td><td>92000</td><td>98000</td> </tr> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
</table> --> </body> </html> 24. Confeccionar un formulario que solicite el ingreso del nombre de una persona y su edad. Luego llamar a la pﾃ｡gina "/registrardatos.php" para que imprima en pantalla los valores ingresados. Disponer un botﾃｳn de tipo submit para el envﾃｭo de los datos. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese nombre: <input type="text" name="nombre" size="20"> <br> Ingrese su edad: <input type="text" name="edad" size="3"> <br> <input type="submit" value="enviar"> </form> </body> </html> 25. Confeccionar un formulario que solicite el ingreso de mail de una persona y luego pida el ingreso de su clave dos veces (recordar inicializar la propiedad name del elemento input con distintos nombres para cada control) <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su mail: <input type="text" name="nombre" size="50"> <br> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
Ingrese su clave: <input type="password" name="clave1" size="12"> <br> Repita el ingreso de su clave: <input type="password" name="clave2" size="12"> <br> <input type="submit" value="enviar"> <input type="reset" value="borrar"> </form> </body> </html> 26. Confeccionar un formulario que permita ingresar el nombre de una persona, su mail, su dni (documento nacional de identidad) y finalmente su curriculum (este último dato hacerlo utilizando un textarea) <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su nombre: <input type="text" name="nombre" size="30"><br> Ingrese su mail: <input type="text" name="mail" size="50"><br> Ingrese su dni: <input type="text" name="dni" size="9"><br> Ingrese su Curriculum:<br> <textarea name="curriculum" rows="7" cols="80"></textarea> <br> <input type="submit" value="Enviar"> </form> </body> </html> 27. Confeccione un formulario que solicite el ingreso de un mail, una clave y luego muestre una serie de títulos de películas con su respectivo checkbox. Disponer también del botón de tipo submit para el envío de datos al servidor. Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su mail: <input type="text" name="mail" size="50"><br> Ingrese su clave: <input type="password" name="clave" size="10"><br> <em>Seleccione las películas a pedir:</em> <br> <input type="checkbox" name="pelicula1">Batman y Robin<br> <input type="checkbox" name="pelicula2">Superman regresa<br> <input type="checkbox" name="pelicula3">Una película de miedo<br> <input type="checkbox" name="pelicula4">La historia sin fin<br> <input type="submit" value="Enviar"> </form> </body> </html> 28. Confeccionar un formulario que solicite cual sistema operativo utiliza más (linux o window) <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su nombre: <input type="text" name="nombre" size="30"><br> Que sistema operativo utiliza más? <br> <input type="radio" name="so" value="1">Windows<br> <input type="radio" name="so" value="2">Linux<br> <input type="submit" value="Enviar"> </form> </body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
</html> 29. Confeccionar un formulario que solicite el ingreso del nombre de una persona y permita votar el sitio. Mediante un cuadro de selecciﾃｳn el visitante puede elegir entre las siguientes opciones: Excelente, Muy Bueno, Bueno, Regular y Malo. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su nombre: <input type="text" name="nombre" size="30"><br> Vote este sitio: <select name="voto"> <option value="1">Excelente</option> <option value="2">Muy Bueno</option> <option value="3">Bueno</option> <option value="4">Regular</option> <option value="5">Malo</option> </select> <br> <input type="submit" value="Enviar"> </form> </body> </html> 30. Confeccionar un formulario que muestre en un control select un serie de mail. Luego permitir que el visitante seleccione uno o varios mail del cuadro de selecciﾃｳn. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Seleccione uno o varios mail (Presione Ctrl para seleccionar varios mail)<br> <select name="mail[]" size="4" multiple> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<option value="prodrigues@gmail.com">prodrigues@gmail.com</option> <option value="mpalacio@gmail.com">mpalacio@gmail.com</option> <option value="mbarrionuevo@hotmail.com">mbarrionuevo@hotmail.com</option> <option value="elopez@yahoo.com">elopez@yahoo.com</option> <option value="cmercado@gmail.com">cmercado@gmail.com</option> </select> <br> <input type="submit" value="Enviar"> </form> </body> </html> 31. Confeccione un control de tipo select con los nombres de paises de América y Europa. Agrupe los paises por continente. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Seleccione una pais: <select name="paises"> <optgroup label="América"> <option value="1">Argentina</option> <option value="2">Chile</option> <option value="3>Brasil</option> <option value="4">Uruguay</option> <option value="5">Perú</option> <option value="6">Bolivia</option> </optgroup> <optgroup label="Europa"> <option value="7">España</option> <option value="8">Francia</option> <option value="9">Italia</option> <option value="10">Suiza</option> <option value="11">Alemania</option> <option value="13">Holanda</option> <option value="14">Polonia</option> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<option value="15">Grecia</option> </optgroup> </select> <br> <input type="submit" value="Enviar"> </form> </body> </html> 32. Confeccionar un formulario que solicite el ingreso del nombre de usuario y su clave. Disponer un botón para subir los datos al servidor (en el botón escribir el texto: "Ingreso al" y en la línea siguiente "sitio") <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Nombre de usuario: <input type="text" name="nombre" size="20"> <br> Clave: <input type="password" name="clave" size="20"> <br> <button type="submit">Ingreso al<br>sitio</button> </form> </body> </html> 33. Confeccionar una página que muestre una pregunta y luego tres respuestas posibles. Al lado de cada respuesta disponer un botón creado con el elemento input inicializando la propiedad type con el valor="button" <html> <head> <title>Prueba de formulario</title> </head> <body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
<form action="/registrardatos.php" method="post"> <h1>Cuﾃ｡l es la velocidad de la luz?</h1> 300000 Km por segundo.<input type="button" name="boton1" value="Correcta?"> <br> 200000 Km por segundo.<input type="button" name="boton2" value="Correcta?"> <br> 100000 Km por segundo.<input type="button" name="boton3" value="Correcta?"> </form> </body> </html> 34. Confeccionar un formulario que solicite y envﾃｭe al servidor dos archivos. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post" enctype="multipart/form-data"> Seleccione el archivo 1: <input type="file" name="archi1"> <br> Seleccione el archivo 2: <input type="file" name="archi2"> <br> <input type="submit" value="Enviar"> </form> </body> </html> 35. Confeccionar un formulario que permita solicitar pizzas a domicilio. Agrupar los controles aquellos relacionados con el cliente y los referentes al pedido. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
<fieldset> <legend>Seleccione tipo y cantidad de pizzas</legend> Pizza: <select name="pizza1"> <option value="1">Muzzarella</option> <option value="2">Jamon y Queso</option> <option value="3">Napolitana</option> </select> Cantidad: <select name="cantidad1"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <br> Pizza: <select name="pizza2"> <option value="1">Muzzarella</option> <option value="2">Jamon y Queso</option> <option value="3">Napolitana</option> </select> Cantidad: <select name="cantidad2"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <br> Pizza: <select name="pizza3"> <option value="1">Muzzarella</option> <option value="2">Jamon y Queso</option> <option value="3">Napolitana</option> </select> Cantidad: Esp: GREIDY CECILIA ARCE USMAN
2011
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
2011
<select name="cantidad3"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> </fieldset> <fieldset> <legend>Datos</legend> Nombre: <input type="text" name="nombre" size="30"><br> Dirección: <input type="text" name="direccion" size="25"><br> Teléfono: <input type="text" name="telefono" size="10"><br> </fieldset> <input type="submit" value="Enviar"> </form> </body> </html> 36. Confeccione un formulario de un libro de visitas, se debe solicitar el nombre, mail, pais de origen (por defecto la opcion seleccionada debe ser "seleccione pais"), valoración del sitio (malo,regular,bueno,muy bueno, excelente) por defecto debe estar seleccionado "bueno". Por último disponer un textarea donde se puede ingresar los comentarios. <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Nombre: <input type="text" name="nombre" size="30"><br> Mail: <input type="text" name="mail" size="30"><br> <select name="pais"> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEÑO WEB. GRADO 11
<option value="1" selected>seleccione pais</option> <option value="1">Argentina</option> <option value="2">España</option> <option value="3">México</option> <option value="4">Guatemala</option> <option value="5">Honduras</option> <option value="7">El Salvador</option> <option value="8">Venezuela</option> <option value="9">Colombia</option> <option value="10">Cuba</option> <option value="11">Bolivia</option> <option value="13">Perú</option> <option value="14">Ecuador</option> <option value="15">Paraguay</option> <option value="16">Uruguay</option> <option value="17">Chile</option> </select> <br> Como calificaría a este sitio: <select name="valoracion"> <option value="malo">Malo</option> <option value="regular">Regular</option> <option value="bueno" selected>Bueno</option> <option value="muy bueno">Muy Bueno</option> <option value="excelente">Excelente</option> </select> <br> <textarea name="comentarios" rows="5" cols="40">Ingrese comentarios</textarea><br> <input type="submit" value="Enviar"> </form> </body> </html>
2011
aqui
sus
37. Definir una matriz de 4 filas y 4 columnas de elementos de tipo text. Luego hacer la carga de todos los elementos del perímetro y finalmente los cuatro elementos centrales. <html> <head> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
<title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> <input type="text" name="text1" size="5" tabindex="1"> <input type="text" name="text2" size="5" tabindex="2"> <input type="text" name="text3" size="5" tabindex="3"> <input type="text" name="text4" size="5" tabindex="4"> <br> <input type="text" name="text5" size="5" tabindex="12"> <input type="text" name="text6" size="5" tabindex="13"> <input type="text" name="text7" size="5" tabindex="14"> <input type="text" name="text8" size="5" tabindex="5"> <br> <input type="text" name="text9" size="5" tabindex="11"> <input type="text" name="text10" size="5" tabindex="16"> <input type="text" name="text11" size="5" tabindex="15"> <input type="text" name="text12" size="5" tabindex="6"> <br> <input type="text" name="text13" size="5" tabindex="10"> <input type="text" name="text14" size="5" tabindex="9"> <input type="text" name="text15" size="5" tabindex="8"> <input type="text" name="text16" size="5" tabindex="7"> <br> <input type="submit" value="enviar" tabindex="17"> </form> </body> </html> 38. Confeccionar un formulario que muestre un control de cada tipo y los muestre todos deshabilitados. (Cuando conozca JavaScript podemos habilitarlos por ejemplo si el visitante ingresa una clave correcta, por ahora vea como queda visualmente el formulario con los controles deshabilitados) <html> <head> <title>Prueba de formulario</title> </head> <body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
<form action="/registrardatos.php" method="post"> Ingrese su nombre: <input type="text" name="nombre" size="20" disabled> <br> Ingrese su clave: <input type="password" name="clave" size="12" disabled> <br> Comentarios:<br> <textarea disabled name="comentarios" rows="5" cols="60"> </textarea> <br> <input type="checkbox" name="op1" disabled>Opcion 1<br> <input type="checkbox" name="op2" disabled>Opcion 2<br> <input type="checkbox" name="op3" disabled>Opcion 3<br> <input type="checkbox" name="op4" disabled>Opcion 4<br> <br> <input type="radio" name="op" value="1" disabled>Opcion 1<br> <input type="radio" name="op" value="2" disabled>Opcion 2<br> <input type="radio" name="op" value="3" disabled>Opcion 3<br> <input type="radio" name="op" value="4" disabled>Opcion 4<br> <br> <select name="pais" disabled> <option value="1">Argentina</option> <option value="2">Espaﾃｱa</option> <option value="3">Mﾃｩxico</option> <option value="4">Guatemala</option> <option value="5">Honduras</option> <option value="7">El Salvador</option> <option value="8">Venezuela</option> <option value="9">Colombia</option> <option value="10">Cuba</option> <option value="11">Bolivia</option> <option value="13">Perﾃｺ</option> <option value="14">Ecuador</option> <option value="15">Paraguay</option> <option value="16">Uruguay</option> <option value="17">Chile</option> </select> <br> <button type="submit" disabled>Ingreso al<br>sitio</button> Esp: GREIDY CECILIA ARCE USMAN
2011
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
2011
<br> <input type="submit" value="enviar" disabled> </form> </body> </html> 39. Confeccionar un formulario que solicite el ingreso del nombre y apellido de una persona (hasta 40 caracteres), su edad (3 caracteres como mﾃ｡ximo) y su documento nacional de identidad (hasta 8 caracteres) <html> <head> <title>Prueba de formulario</title> </head> <body> <form action="/registrardatos.php" method="post"> Ingrese su nombre y apellido: <input type="text" name="nombre" maxlength="40" size="20"> <br> Ingrese su edad: <input type="text" name="edad" maxlength="3" size="3"> <br> Ingrese su dni: <input type="text" name="dni" maxlength="8" size="8"> <br> <input type="submit" value="enviar"> </form> </body> </html> 40. Confeccionar una pﾃ｡gina que permita calificar un sitio. Se debe ingresar el nombre y mediante un control de tipo select elegir un valor entre 1 y 10. Asociar elementos de tipo label a cada control. <html> <head> <title>Prueba de formulario</title> </head> <body> Esp: GREIDY CECILIA ARCE USMAN
I.E SAGRADO CORAZON.PRACTICAS DISEﾃ前 WEB. GRADO 11
<form action="/registrardatos.php" method="post"> <fieldset> <legend>Formulario de calificaciﾃｳn.</legend> <label for="nombre">Ingrese su nombre:</label> <input type="text" name="nombre" size="30" id="nombre"><br> <label for="calificacion">Seleccione calificaciﾃｳn:</label> <select name="calificacion" id="calificacion"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> <br> <input type="submit" value="Enviar"> </fieldset> </form> </body> </html>
Esp: GREIDY CECILIA ARCE USMAN
2011