You are on page 1of 7

EJERCICIOS HTML 1.

Confeccionar una pgina que muestre los nombres de 5 lenguajes de programacin separados
por un guin.

2. Confeccione una pgina con las marcas mnimas que debe tener y en el cuerpo de la misma
disponga su nombre y apellido. 3. Confeccionar una pgina HTML que muestre distintos lenguajes de programacin, mostrarlos uno por lnea. 4. Confeccione una pgina HTML que muestre su nombre y apellido y en la siguiente lnea los nombres de sus padres separados por un guin. 5. Confeccione una pgina que muestre dos prrafos. En el primero agregar varios saltos de lnea. 6. Confeccione una pgina que muestre en un prrafo datos referentes a sus estudios y en otro prrafo su nombre y mail. 7. Confeccione una pgina que contenga un ttulo de primer nivel <h1> y luego dos ttulos de nivel <h2>. Definir un prrafo para cada ttulo de segundo nivel. 8. Confeccione el titular de un peridico con un ttulo de nivel 1. Luego definir dos ttulos de segundo nivel con los textos (Noticias polticas y Noticias deportivas), en cada una de estas secciones definir dos titulares de tercer nivel con un prrafo cada una. Al final de la pgina mostrar un ttulo de cuarto nivel con el nombre de la empresa propietaria del peridico. 9. Crear una pgina que contenga cuatro prrafos. En el primero enfatizar con el mximo nivel y en los otros prrafos emplear el elemento de enfatizar de menor fuerza. 10. Confeccione una pgina que muestre la definicin de tres palabras. Aplicar el elemento strong a cada palabra previo a su definicin. Luego agregar el elemento em a una o a un conjunto de palabras dentro de la definicin. 11. Confeccione una pgina principal que tenga un hipervnculo a otra pgina secundaria. La pgina secundaria debe tener tambin un hipervnculo a la pgina principal. 12. Confeccione una pgina principal con dos hipervnculos a las pginas pagina2.html y pagina3.html. Luego en las dos pginas secundarias disponer hipervnculos a la pgina principal 13. Confeccione una pgina que contenga un enlace al sitio de google. 14. Confeccione una pgina que contenga un hipervnculo a un peridico (indicar slo el nombre de dominio del peridico). Disponer adems un segundo hipervnculo a una pgina determinada de ese peridico 15. Implementar una pgina que muestre una imagen llamada foto1.jpg que se encuentra en el mismo servidor y en la misma carpeta donde se localiza el archivo HTML. 16. Desarrollar una pgina que muestre dos imgenes llamadas foto2.jpg y foto3.jpg, las mismas se encuentran almacenadas en el servidor en la misma carpeta donde se almacenar la pgina que usted desarrollar.Disponer un ttulo a cada imagen. 17. Confeccione una pgina que muestre dos imagenes (foto1.jpg y foto2.jpg) como hipervnculos. Al ser presionados llamar a otra pgina. 18. Crear tres pginas con una foto cada una (foto1.jpg, foto2.jpg y foto3.jpg) luego al ser presionada avanzar a la siguiente pgina, 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. 19. Confeccione una pgina que contenga dos hipervnculos a los peridicos La Nacin y el Clarin. Hacer que el hipervnculo del peridico el Clarin sea abierto en otra ventana del navegador. 20. Confeccione una pgina que muestre enlaces a distintos blog. Agruparlos bajo dos ttulos que muestren los mismos enlaces, el primero "Hacer la apertura en otra ventana" y el segundo "Hacer la apertura en el mismo navegador".

21. Confeccione una pgina que contenga un hipervnculo configurando la propiedad href de tal
manera que abra un cliente de correo. 22. Una empresa que vende pizzas tiene 3 ofertas. Las mismas son ( 1- 1 mozzarella y una bebida cola a 5 euros, 2- 2 mozzarellas a 6 euros y 3 - 4 mozarrellas a 10 euros). Confeccione una pgina que disponga tres hipervnculos a cada una de esas ofertas. Al ser presionadas abrir el cliente de correo y enviar la promocin correspondiente. En el ttulo indicar si se trata de la promocin 1, 2 o 3. En el cuerpo del mensaje pedir que ingrese la direccin y telfono de la persona que hace el pedido. 23. Confeccione una pgina que contenga cuatro anclas, luego definir cuatro hipervnculos que se enlacen con dichas anclas. 24. Disponer una serie de hipervnculos sobre noticias del da. Enlazar los hipervnculos con anclas que se encuentran ms abajo en la misma pgina. 25. Confeccione una pgina que contenga cuatro anclas y una segunda pgina que defina cuatro hipervnculos que se enlacen con dichas anclas 26. Disponer una serie de hipervnculos sobre noticias del da. Enlazar los hipervnculos con anclas que se encuentran en otra pgina. 27. Mostrar el orden de llegada de tres corredores utilizando el elemento HTML ol. 28. Confeccione una lista ordenada con los tres pases con mayor poblacin del planeta. Disponer un ttulo de segundo nivel y debajo de la lista la suma de habitantes de esos tres pases enfatizado. 29. Confeccione una pgina HTML que contenga una lista no ordenada con cuatro lenguajes de programacin muy populares. Agregar un ttulo de segundo nivel indicando el concepto de esta lista. 30. Confeccione una lista no ordenada que contenga hipervnculos a distintos peridicos que usted conoce. 31. Confeccione una lista de definicin indicando en los conceptos distintos lenguajes de programacin. En la definicin hacer una breve introduccin del mismo. 32. Confeccione una lista de definicin de un conjunto de palabras que utilice en su mbito laboral. 33. Implementar una pgina que enumere una serie de paises en una lista ordenada y luego en cada pais disponer una lista de hipervnculos de peridicos de dicho pais. 34. Confeccione una lista no ordenada de lenguajes de programacin. Luego disponer una lista ordenada con hipervnculos a sitios que tratan dichos lenguajes. 35. Confeccione una tabla que muestre los nombre de paises en una columna y su cantidad de habitantes en otra. 36. Confeccione una tabla que muestre en la primer columna los nombre de distintos empleados de una compaa y en la segunda el sueldo bruto (la compaa tiene 4 empleados) 37. Confeccione una tabla que muestre los nombre de paises en una columna y su cantidad de habitantes en otra. Disponer un ttulo a cada columna mediante celdas creadas mediante el elemento th. 38. Confeccione una tabla que muestre en la primer columna los nombre de distintos empleados de una compaa y en la segunda el sueldo bruto (la compaa tiene 4 empleados) Mostrar los textos 'Nombre del Empleado' y 'Sueldo Bruto' como primer fila de la tabla. 39. Confeccione una tabla que muestre los nombre de pases en una columna y su cantidad de habitantes en otra. Disponer un ttulo de los datos que representa la tabla.

40. Confeccione una tabla que muestre en la primer columna los nombre de distintos empleados de
una compaa y el la segunda el sueldo bruto (la compaa tiene 4 empleados) Disponer en la tabla un ttulo representativo.

41. Confeccionar una tabla que muestre la facturacin de los tres ltimos meses de los artculos: Discos duros, CPU y Monitores. La primera columna debe mostrar slo el texto recursos y en la primera fila el texto Facturacin de los tres ltimos meses. 42. Confeccionar una tabla que muestre los nombres de peridicos y su nombre de dominio
agrupados por paises. En la primer columna disponer los nombre de paises, expandir en fila de acuerdo a la cantidad de diarios de cada pais. 43. Confeccionar dos pginas que inicialicen el elemento title. Disponer un hipervnculo en cada pgina. 44. Confeccionar una pgina que muestre en el elemento title el nombre de dominio del sitio 45. Confeccionar una pgina HTML. Definir el elemento title y los metadatos para indicar autor, palabras claves para buscadores, descripcin de la pgina y copyright. 46. Confeccionar una pgina que contenga una tabla. Almacenar en un comentario datos referentes al contenido de la tabla que solo interesen al desarrollador. 47. Confeccionar un pgina que muestre dos tablas. Luego comentar la segunda y ver el resultado. 48. Mostrar las siguiente ecuacin: 10+x*y agregar aqu el smbolo menor 12*z 49. Mostrar una tabla con dos columnas en la primera enumerar una serie de artculos y en la segunda sus precios (agregarle el caracter de Euros a cada precio) 50. Confeccionar un formulario que contenga un cuadro de texto donde el visitante debe ingresar su nombre y un botn de tipo submit para el envo de los datos ingresados al servidor 51. Confeccionar un formulario que solicite el ingreso del nombre de una persona y su edad. Luego llamar a la pgina "/registrardatos.php" para que imprima en pantalla los valores ingresados. Disponer un botn de tipo submit para el envo de los datos. 52. Confeccionar un formulario que solicite el ingreso del nombre de un usuario y su clave. Mostrar asteriscos donde se ingresa la clave. Disponer dos botones, uno para el envo de datos al servidor y otro para borrar el contenido de todos los controles (editores de texto) que contiene el formulario. 53. 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) 54. Confeccionar un formulario para que un visitante pueda ingresar su nombre, su mail y un comentario del sitio, empleando para este ltimo dato a ingresar un elemento de tipo textarea. 55. 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) 56. Implementar un formulario que solicite el ingreso del nombre de una persona y 4 elementos de tipo checkbox para que seleccione los lenguajes de programacin que conoce. 57. Confeccione un formulario que solicite el ingreso de un mail, una clave y luego muestre una serie de ttulos de pelculas con su respectivo checkbox. Disponer tambin del botn de tipo submit para el envo de datos al servidor. 58. Solicitar el ingreso del nombre de una persona y el mximo nivel en estudios alcanzado (sin estudios, estudios primarios, estudios secundarios o estudios universitarios).Utilizar controles de tipo radio para la seleccin de estudios realizados. 59. Confeccionar un formulario que solicite cual sistema operativo utiliza ms (linux o window)

60. Confeccionar un formulario que solicite cargar el nombre de una persona y el pais donde vive,
este ltimo elemento mediante un control de tipo select permitir seleccionar el pais. (Agregue la propiedad size al elemento select con el valor 5) 61. Confeccionar un formulario que solicite el ingreso del nombre de una persona y permita votar el sitio. Mediante un cuadro de seleccin el visitante puede elegir entre las siguientes opciones: Excelente, Muy Bueno, Bueno, Regular y Malo. 62. Confeccionar un cuadro de seleccin mltiple para elegir colores de una lista. Permitir la seleccin de varios colores. 63. 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 seleccin. 64. Confeccionar una pgina que muestre un control de tipo select. Agrupar las opciones en dos grupos, en uno las frutas y en otro las verduras. Utilizar el elemento optgroup para el agrupamiento. 65. Confeccione un control de tipo select con los nombres de paises de Amrica y Europa. Agrupe los paises por continente. 66. Confeccionar un formulario que solicite el ingreso del nombre de una persona y dos elementos button para subir el dato al servisor o borrar el dato cargado. 67. Confeccionar un formulario que solicite el ingreso del nombre de usuario y su clave. Disponer un botn para subir los datos al servidor (en el botn escribir el texto: "Ingreso al" y en la lnea siguiente "sitio") 68. Confeccionaremos una pgina que muestre el teclado de una calculadora. Utilizar el elemento input inicializando la propiedad type con el valor "button". 69. Confeccionar una pgina que muestre una pregunta y luego tres respuestas posibles. Al lado de cada respuesta disponer un botn creado con el elemento input inicializando la propiedad type con el valor="button" 70. Confeccionar un formulario que solicite el ingreso del nombre de una persona y permita seleccionar y enviar su foto. 71. Confeccionar un formulario que solicite y enve al servidor dos archivos. 72. Confeccionar un formulario que solicite ingresar el nombre de una persona y en un campo oculto almacene una hora cualquiera. 73. Confeccionar un formulario que solicite ingresar el nombre de una persona y en un campo oculto almacene una hora cualquiera. 74. Confeccionar un formulario que permita solicitar pizzas a domicilio. Agrupar los controles aquellos relacionados con el cliente y los referentes al pedido 75. Confeccione un formulario que solicite el ingreso del nombre de una persona. Luego que seleccione si es mayor de edad o no (por defecto inicializar en si),seguidamente el telfono (cargar por defecto 6) y por ltimo en un textarea solicitar que ingrese comentarios. 76. 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"), valoracin 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. 77. Implementar un formulario que contenga una matriz de tres filas y tres columnas de elementos de tipo text. Hacer que el foco sea por columna, es decir primero tomar foco el text de la primer fila y primer columna, luego el text de la segunda fila y primer columna etc. (si no definimos la propiedad tabindex la carga de datos se efectua por fila) 78. Definir una matriz de 4 filas y 4 columnas de elementos de tipo text. Luego hacer la carga de todos los elementos del permetro y finalmente los cuatro elementos centrales.

79. Confeccionar un formulario que muestre tres controles de tipo radio. Mostrar los textos Nios,
Adolescentes y Mayores. Deshabilitar el el elemento radio que corresponde a Nios. 80. 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) 81. Confeccionar un formulario que solicite el nombre de usuario y su clave, solo permitir ingresar en el nombres de usuarios hasta 20 caracteres y la claves hasta 12. 82. Confeccionar un formulario que solicite el ingreso del nombre y apellido de una persona (hasta 40 caracteres), su edad (3 caracteres como mximo) y su documento nacional de identidad (hasta 8 caracteres) 83. Confeccionar un formulario que aparezca el nombre de una empresa en un text y el texto de un contrato en un textarea, ambos de solo lectura. 84. Crear un controles de tipo text,password y textarea. Disponerlos todos de solo lectura. 85. Confeccionar una pgina que permita hacer un reclamo de reparaciones y se enven los datos a una direccin de correo. Se debe poder ingresar el nombre, direccin y un comentario del problema. 86. Confeccionar un formulario que permita solicitar pizzas a domicilio. Enviar el pedido a la direccin de correo pizzas@gmail.com 87. Confeccionar un formulario que solicite el ingreso del nombre, mail y comentarios de un visitante al sitio. Asociar cada control con un elemento label. 88. Confeccionar una pgina 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. 89. Confeccionar una pgina que contenga dos frames verticales, el primero que ocupe el 20% y el segundo el 80% de la ventana. 90. Confeccionar una ventana que contenga 3 frames horizontales. Para esto definir la propiedad row del elemento frameset con el siguiente valor: rows="20%,60%,20%" 91. Confeccionar una ventana que contenga dos frames verticales. Disponer dos hipervnculos en el frame de la izquierda que al ser presionados actualicen el archivo a mostrar por el frame de la derecha. 92. Confeccionar una pgina que contenga dos frames verticales. En el frame de la izquierda disponer hipervnculos a peridicos de su pas. Cuando se presione el hipervnculo actualizar el frame de la derecha con la pgina principal de ese peridico (tener en cuenta que los frames pueden mostrar pginas que se encuentran en distintos servidores) 93. Confeccionar una pgina que contenga tres frames verticales, el de la izquierda y el de la derecha deben tener 200 pxeles de ancho, el siguiente ocupa el resto. 94. Confeccionar una ventana que contenga 3 frames horizontales.Hacer que el frame superior tenga una altura de 80 pxeles, el frame inferior 100 pxeles y el frame central ocupe el resto 95. Confeccionar una ventana con dos frame verticales. No permitir redimensionarlos y no mostrar el borde de los frames. Hacer que el frame de la derecha siempre muestre la barra de desplazamiento. 96. Confeccionar una pgina con dos frames horizontales. En la parte superior definir un frame con 100 pxeles de alto. Hacer que el mismo no se pueda redimensionar, no mustre la barra de scroll y no mustre el borde. 97. Confeccionar una pgina que la primer columna tenga un frame y la segunda columna tenga dos frames. Utilizar frameset anidados para resolver el problema.

98. Confeccionar una pgina que contenga dos filas. La primera fila muestre un frame de 70 pxeles
de alto y la segunda fila dividirla en dos columnas que tengan dos frames, el primero de 200 pxeles y el otro del resto de pxeles sobrantes. Hacer que no se puedan redimensionar. 99. Confeccionar una pgina que incorpore un iframe de 400 pxeles de ancho por 200 pxeles de alto. 100.Confeccionar una pgina que muestre dos iframes de 300*300 pxeles cada uno. Hacer que las barras de desplazamiento siempre esten visibles. 101.Confeccionar la primer pgina del tutorial, modificar para que valide el cdigo HTML 4.01 Transitional. Luego copie y pegue el cdigo HTML en el sitio de validacin validator.w3.org 102.Confeccione una pgina que contenga una lista anidada y una tabla. Hacer la pgina que valide con HTML 4.01 transitorio.Luego copie y pegue el cdigo HTML en el sitio de validacin validator.w3.org 103. Confeccionar la primer pgina del tutorial, modificar para que valide el cdigo HTML 4.01 Estricto. Luego copie y pegue el cdigo HTML en el sitio de validacin validator.w3.org 104.Confeccione una pgina que contenga los siguientes elementos a parte de la estructura mnima de un archivo HTML: a,p,h1,table,img. Hacer la pgina que valide con HTML 4.01 estricto.Luego copiar y pegar en el programa validador de validator.w3.org 105.Confeccionar una ventana que contenga dos frames verticales. Disponer dos hipervnculos en el frame de la izquierda que al ser presionados actualicen el archivo a mostrar por el frame de la derecha. Definir el elemento DOCTYPE para cada pgina. Luego validar cada pgina en el sitio de validator.w3.org 106.Confeccionar una pgina con dos frame horizontales. En la parte superior definir un frame con 100 pxeles de alto. Hacer que el mismo no se pueda redimensionar, no mustre la barra de scroll y no mustre el borde. Luego validar cada pgina en el sitio de validator.w3.org 107.Confeccionar una pgina que muestre los nombres de 5 lenguajes de programacin separados por un guin. Agregar un enlace a la pgina de validacin de HTML. 108. Confeccionar una pgina que contenga un ttulo de nivel 1 de color azul (#0000ff) y un prrafo de color gris oscuro (#888888) y fondo amarillo claro (#ffffdd). 109.Sabemos que hay una propiedad en CSS que define el tamao de la fuente en pxeles llamada font-size. Luego cree varios prrafos con fuentes decrecientes, el primero definirlo con el siguente valor: style="font-size:30px" 110. Confeccionar una pgina que contenga un ttulo de nivel 2 (h2) centrado y luego bloques donde muestre un nombre de una persona subrayado y un prrafo con un color de fondo y de las letras. Indentar la primer linea de cada prrafo. 111.Confeccionar una pgina que muestre el ttulo de una noticia. Seguidamente un prrafo con el resumen de la noticia y finalmente la noticia completa. Utilizar las propiedades relacionadas al texto vistas para realzar la noticia en la pgina 112. Listar una serie de nombres y un bloque de comentarios para cada nombre. Indentar la primer linea de cada prrafo. Hacer que algunas palabras del prrafo aparezcan resaltadas en otro color. Disponer todos los comentarios con un color gris de fondo. 113.Confeccionar una pgina que contenga dos divisiones con una serie de prrafos cada una. Disponer color de fondo distinto para cada seccin. En la segunda seccin mostrar el mismo texto de la primera seccin pero con algunas palabras tachadas. 114. Confeccionar una pgina que contenga un ttulo de nivel 2 con fuente Arial, un prrafo con fuente de tipo Times New Roman de 14 pxeles en negrita y una serie de prrafos agrupados en un div con tamao de fuente de 12 pxeles de tipo Verdana

115.Confeccionar una pgina que muestre un pequeo tutorial sobre un tema que usted conozca.
Defina un ttulo principal para el tutorial. Utilice una lista ordenada para indicar los distintos conceptos que contiene el tutorial con enlaces a los temas propiamente dicho. Cada tema debe tener su ttulo y la descripcin del tema. Utilice los conceptos bsicos presentados hasta el momento sobre CSS.

You might also like