SlideShare ist ein Scribd-Unternehmen logo
1 von 7
Downloaden Sie, um offline zu lesen
Creación de páginas web. Lenguaje HTML > HTML,siglas de HyperTextMarkup Language («lenguaje de marcas de hipertexto»),
Ejercicios de Lenguaje HTML (I)
Ejercicio 1
1.- Abre el Bloc de Notas y escribe el siguiente texto:
<HTML>
<HEAD>
<TITLE>Mi primera página</TITLE>
<HEAD>
<BODY>
<CENTER><H1>Mi primera página</H1></CENTER>
<HR>
<P>Esta es mi primera página
</BODY>
</HTML>
2.- Guárdalo con el nombre mipag01tunombre.html
3.- Arranca el navegador y abre el fichero que acabas de crear.
Ejercicio 2
Edita el fichero mipag01tunombre.html y pon el siguiente cuerpo a la página.
<H1>TÍTULO 1</H1>
<H2>TÍTULO 2</H2>
<H3>TÍTULO 3</H3>
<H4>TÍTULO 4</H4>
<H5>TÍTULO 5</H5>
<H6>TÍTULO 6</H6>
Sálvalo con el nombre mipag02tunombre.html y luego ábrelo con el navegador.
Ejercicio 3
1.- Edita el fichero mipag01.html y pon en el cuerpo dos o tres párrafos (de tres o cuatro líneas caada párrafo)
tomados del artículo de la energía en Andalucía. Separa los párrafos sin poner etiquetas, sólo pulsando Intro
una o dos veces. Sálvalo, y luego edítalo con tu navegador. Observa que los párrafos se ven juntos.
2.- Sigue con la edición del fichero, pon las etiquetas <P> a cada párrafo. Sálva el fichero y ábrelo con el
navegador.
3.- Aumenta la separación entre párrafos con <BR> y <P>.
Ejercicio 4:
Para comprobar cómo se pueden alinear textos.
1.- Edita el fichero mipag01tunombre.html y justifica todos los párrafos con <DIV align=justify>. Comprueba
en el navegador la presentación.
2.- Ahora centra el párrafo y ajusta a la derecha el segundo. Comprueba el resultado.
Ejercicio 5:
Para cambiar el aspecto de la letra
1.- Edita el fichero mipagina01tunombre.html y pon a las frases del primer párrafo las etiquetas adecuadas
para que aparezcan en negrita, cursiva y teletipo.
2.- Usa la etiqueta <FONT> con size = 1,2, etc., para tener las primeras palabras del segundo párrafo en
tamaño creciente.
3. Ahora usa la etiqueta <FONT> con size = + 1, - 1, + 2, - 2, etc. para tener las primeras palabras del segundo
párrafo en tamaño creciente y decreciente.
Ejercicio 6:
Para comprobar los parámetros de los colores. Guía de colores
Black Silver Gray White Maroon Red Purple Fuchsia
Green Lime Olive Yellow Navy Blue Teal Aqua
1.- Haz un fichero colores01tunombre.html con varias líneas como la siguiente, una para cada uno de los
colores de la tabla anterior.
<FONT color=”red”>Rojo</FONT>
Ejercicio 7:
1.- Haz un fichero colores02tunombre.html con el siguiente texto:
<FONT COLOR=”#FF0000”>Rojo 100%</FONT>
<FONT COLOR=”#8F0000”>Rojo 50%</FONT>
<FONT COLOR=”#4F0000”>Rojo 25%</FONT><P>
<FONT COLOR=”#00FF00”>Verde 100%</FONT>
<FONT COLOR=”#008F00”>Verde 50%</FONT>
<FONT COLOR=”#004F00”>Verde 25%</FONT><P>
<FONT COLOR=”#0000FF”>Azul 100%</FONT>
<FONT COLOR=”#00008F”>Azul 50%</FONT>
<FONT COLOR=”#00004F”>Azul 25%</FONT>
Sálvalo y léelo en tu navegador.
2.- Cambia los colores RGB anteriores y observa los resultados.
3.- Experimenta con los códigos para obtener el color amarillo.
Ejercicio 8:
Para comprobar cómo hacer hipertexto.
Los mecanismos más usados son los siguientes:
1.- Haz una página llamada interesantesminombre.html donde poner enlaces a sitios interesantes. Por
ejemplo, puedes empezar con el siguiente texto:
<HTML>
<HEAD>
<meta http-equiv=”Content-Type” content=”text/html; char-
set=ISO-8559-1”>
<TITLE>Sitios de interés</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>Mis páginas favoritas</H1>
</CENTER>
<HR>
Estas son mis páginas favoritas:
<P><A HREF=”http://www.google.es”>Google</A>
<BR> <A HREF=”http://www.juntadeandalucia.es/averroes/iesalfonso_romero_barcojo”>IES Alfonso Romero
Barcojo</A>
</BODY>
</HTML>
Ejercicio 9:
Para comprobar cómo se hacen listas.
Listas desordenadas:
Listas ordenadas:
Ejercicio 10:
Haz una lista desordenada con los nombres:Desayuno, almuerzo, Merienda y Cena.
Convierte en ordenada la lista anterior.
Ejercicio 11:
Para incluir gráficos e imágenes en unestras páginas utilizaremos la etiqueta <IMG> de esta manera:
<IMG SRC="fichero_grafico"" ALT="description"
El parámetro SRC especifica el nombre del fihero que contiene el gráfico. Los formatos de imagen deben ser
JGP o GIF. El parámetro ALT especifica el texto que se mostrará en lugar del gráfico en aquellos navegadores
que no lo muestren.
Con los parámetros HEIGHT y WIDTH se puede indicar siempre: la altura y la anchura del gráfico en píxeles.
<IMG SRC="animales/gato.jpg" ALT="Gato" Width=100 Height=145
El nombre del fichero imagen debe hacer referencia ala carpeta de origen del mismo. No se pondrá si ésta es
la misma que la del documento HTML que estamos elaborando.
Se puede alinear una imagen a la izquierda o a la derecha de la página. Esto se consigue con los parámetros
ALIGN= RIGHT (imagen a la derecha) y ALIGN=LEFT (la imagen queda a la izquierda).
También se puede poner una imagen como fondo de toda la página. Esto se consigue poniendo el parámetro
BACKGRONUD="imagen" en la etiqueta <BODY>, siendo imagen el nombre del fichero gráfico GIF o JPG.
<BODY BACKGROUND="animales/gato.gif">
Apoyándote en la explicación anterior, edita el archivo del ejercicio nº 3 e inserta una imagen centrada detrás
de cada párrafo.
Ejercicio 12:
Edita el archivo nº 6 y coloca como imagen de fondo de la página una paleta de colores que captures en
Internet.
Caráct
er
Entidad
HTML
Caráct
er
Entidad
HTML
á &aacute; Á &Aacute;
é &eacute; É &Eacute;
í &iacute; Í &Iacute;
ó &oacute; Ó &Oacute;
ú &uacute; Ú &Uacute;
ü &uuml; Ü &Uuml;
ñ &ntilde; Ñ &Ntilde;
¡ &iexcl; ¿ &iquest;

Weitere ähnliche Inhalte

Was ist angesagt?

Html sistemas
Html sistemasHtml sistemas
Html sistemasLeotom
 
Mi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notasMi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notasJessi De Jesus Torres
 
Codigos html y como crear una pagina Web
Codigos html y como crear una pagina WebCodigos html y como crear una pagina Web
Codigos html y como crear una pagina WebJoshi Tüsa
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandraTatianita Is
 
Actividades iniciales html
Actividades iniciales htmlActividades iniciales html
Actividades iniciales htmlPepe Potamo
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Htmlmarcos0209
 
Programación en html 2
Programación en html 2Programación en html 2
Programación en html 2luchopaisa
 

Was ist angesagt? (12)

Html sistemas
Html sistemasHtml sistemas
Html sistemas
 
Mi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notasMi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notas
 
MANUAL PARA CREAR PÁGINAS WEB CON HTML
MANUAL PARA CREAR PÁGINAS WEB CON HTMLMANUAL PARA CREAR PÁGINAS WEB CON HTML
MANUAL PARA CREAR PÁGINAS WEB CON HTML
 
html
htmlhtml
html
 
Codigos html y como crear una pagina Web
Codigos html y como crear una pagina WebCodigos html y como crear una pagina Web
Codigos html y como crear una pagina Web
 
Expo html alexa
Expo html alexaExpo html alexa
Expo html alexa
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
Actividades iniciales html
Actividades iniciales htmlActividades iniciales html
Actividades iniciales html
 
Adobe dream weaver tutorial
Adobe dream weaver tutorialAdobe dream weaver tutorial
Adobe dream weaver tutorial
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Html
 
Programación en html 2
Programación en html 2Programación en html 2
Programación en html 2
 

Andere mochten auch (20)

Ejercicios Basicos HTML
Ejercicios Basicos HTMLEjercicios Basicos HTML
Ejercicios Basicos HTML
 
Ejercicios básicos HTML
Ejercicios básicos HTMLEjercicios básicos HTML
Ejercicios básicos HTML
 
Ficha de codigos HTML
Ficha de codigos HTMLFicha de codigos HTML
Ficha de codigos HTML
 
Manual de php con ejercicios
Manual de php con ejerciciosManual de php con ejercicios
Manual de php con ejercicios
 
Cuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-phpCuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-php
 
Html5
Html5Html5
Html5
 
Comandos html
Comandos htmlComandos html
Comandos html
 
Html
HtmlHtml
Html
 
Lenguaje HTML5
Lenguaje HTML5Lenguaje HTML5
Lenguaje HTML5
 
Intro html+css
Intro html+cssIntro html+css
Intro html+css
 
Etiqueta body parametros
Etiqueta body parametrosEtiqueta body parametros
Etiqueta body parametros
 
Fichas de html 2014
Fichas de html 2014Fichas de html 2014
Fichas de html 2014
 
Ruby 101 session 3
Ruby 101 session 3Ruby 101 session 3
Ruby 101 session 3
 
Aplicación de buscador semántico
Aplicación de buscador semánticoAplicación de buscador semántico
Aplicación de buscador semántico
 
Guia prática n°1
Guia prática n°1Guia prática n°1
Guia prática n°1
 
Curso de php practico
Curso de php practicoCurso de php practico
Curso de php practico
 
Creación de actividades
Creación de actividadesCreación de actividades
Creación de actividades
 
Ejercicios PHP
Ejercicios PHPEjercicios PHP
Ejercicios PHP
 
Cuestionario Preparatorio Html, css y html 5
Cuestionario Preparatorio Html, css y html 5Cuestionario Preparatorio Html, css y html 5
Cuestionario Preparatorio Html, css y html 5
 
COMANDO HTML
COMANDO HTMLCOMANDO HTML
COMANDO HTML
 

Ähnlich wie Comando y ejercicios para HTML

Ähnlich wie Comando y ejercicios para HTML (20)

323912299 ejercicios-html-bloc-de-notas-220221203647
323912299 ejercicios-html-bloc-de-notas-220221203647323912299 ejercicios-html-bloc-de-notas-220221203647
323912299 ejercicios-html-bloc-de-notas-220221203647
 
Html actividades 1
Html actividades  1Html actividades  1
Html actividades 1
 
Html creacion de una pagina. Adriano Mazziotti
Html  creacion de una pagina. Adriano MazziottiHtml  creacion de una pagina. Adriano Mazziotti
Html creacion de una pagina. Adriano Mazziotti
 
Ejercicios htm lcompletos
Ejercicios htm lcompletosEjercicios htm lcompletos
Ejercicios htm lcompletos
 
Html actividades 1
Html actividades  1Html actividades  1
Html actividades 1
 
Practicas html
Practicas htmlPracticas html
Practicas html
 
Html, css y tablas.compressed
Html, css y tablas.compressedHtml, css y tablas.compressed
Html, css y tablas.compressed
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
Html
HtmlHtml
Html
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
Crea una pagina web
Crea una  pagina webCrea una  pagina web
Crea una pagina web
 
Expo html alexandra
Expo html alexandraExpo html alexandra
Expo html alexandra
 
html
htmlhtml
html
 
Actividad 10º
Actividad 10ºActividad 10º
Actividad 10º
 
D
DD
D
 
Manual html
Manual htmlManual html
Manual html
 
Tutorial ejercicio 1
Tutorial ejercicio 1Tutorial ejercicio 1
Tutorial ejercicio 1
 
HTML
HTMLHTML
HTML
 
HTML
HTMLHTML
HTML
 

Mehr von rogeliotapia

Valor del Software Original.pptx
Valor del Software Original.pptxValor del Software Original.pptx
Valor del Software Original.pptxrogeliotapia
 
conocimientos basicos sobre licenciamiento microsoft.pptx
conocimientos basicos sobre licenciamiento microsoft.pptxconocimientos basicos sobre licenciamiento microsoft.pptx
conocimientos basicos sobre licenciamiento microsoft.pptxrogeliotapia
 
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdf
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdfESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdf
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdfrogeliotapia
 
Conversión de color a b
Conversión de color a bConversión de color a b
Conversión de color a brogeliotapia
 
Guía paso a paso como crear e importar en aplicación de Roar
Guía paso a paso como crear e importar en aplicación de RoarGuía paso a paso como crear e importar en aplicación de Roar
Guía paso a paso como crear e importar en aplicación de Roarrogeliotapia
 
Guia para compartir recursos en goconcr
Guia para compartir recursos en goconcrGuia para compartir recursos en goconcr
Guia para compartir recursos en goconcrrogeliotapia
 
Secuencia didáctica 3to optativa de produccionMultimedia I
Secuencia didáctica 3to  optativa de produccionMultimedia ISecuencia didáctica 3to  optativa de produccionMultimedia I
Secuencia didáctica 3to optativa de produccionMultimedia Irogeliotapia
 
Secuencia didáctica 6to web y redes aplicadas a las artes
Secuencia didáctica 6to web y redes aplicadas a las artesSecuencia didáctica 6to web y redes aplicadas a las artes
Secuencia didáctica 6to web y redes aplicadas a las artesrogeliotapia
 
Añadir un Gadget en HTML en Blog
Añadir un Gadget en HTML en BlogAñadir un Gadget en HTML en Blog
Añadir un Gadget en HTML en Blogrogeliotapia
 
Fotovoz photovoice rt
Fotovoz photovoice rtFotovoz photovoice rt
Fotovoz photovoice rtrogeliotapia
 
¿Qué es un Weblog / Blog?
¿Qué es un Weblog / Blog?¿Qué es un Weblog / Blog?
¿Qué es un Weblog / Blog?rogeliotapia
 
Uso educativo de los wikis
Uso educativo de los wikisUso educativo de los wikis
Uso educativo de los wikisrogeliotapia
 
Empleo de Wikis como apoyo en desarrollo colaborativo de ejercicios
Empleo de Wikis como apoyo en desarrollo colaborativo de ejerciciosEmpleo de Wikis como apoyo en desarrollo colaborativo de ejercicios
Empleo de Wikis como apoyo en desarrollo colaborativo de ejerciciosrogeliotapia
 
El uso de las Webquest, los Blogs y las Wiki en la docencia universitaria
El uso de las Webquest, los Blogs y las Wiki en la docencia universitariaEl uso de las Webquest, los Blogs y las Wiki en la docencia universitaria
El uso de las Webquest, los Blogs y las Wiki en la docencia universitariarogeliotapia
 
Presentavideomarcadeagua
PresentavideomarcadeaguaPresentavideomarcadeagua
Presentavideomarcadeaguarogeliotapia
 
Tres puntos primordiales para identificar fuentes confiables en artículos y ...
Tres puntos primordiales para identificar fuentes confiables en artículos y ...Tres puntos primordiales para identificar fuentes confiables en artículos y ...
Tres puntos primordiales para identificar fuentes confiables en artículos y ...rogeliotapia
 
Guía a la redacción en el estilo APA, 6ta edición
Guía a la redacción en el estilo APA, 6ta ediciónGuía a la redacción en el estilo APA, 6ta edición
Guía a la redacción en el estilo APA, 6ta ediciónrogeliotapia
 
Educacion con TICS
Educacion con TICSEducacion con TICS
Educacion con TICSrogeliotapia
 

Mehr von rogeliotapia (20)

Valor del Software Original.pptx
Valor del Software Original.pptxValor del Software Original.pptx
Valor del Software Original.pptx
 
conocimientos basicos sobre licenciamiento microsoft.pptx
conocimientos basicos sobre licenciamiento microsoft.pptxconocimientos basicos sobre licenciamiento microsoft.pptx
conocimientos basicos sobre licenciamiento microsoft.pptx
 
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdf
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdfESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdf
ESTADÍSTICA DESCRIPTIVA, MEDIANTE MICROSOFT EXCEL.pdf
 
Conversión de color a b
Conversión de color a bConversión de color a b
Conversión de color a b
 
Guía paso a paso como crear e importar en aplicación de Roar
Guía paso a paso como crear e importar en aplicación de RoarGuía paso a paso como crear e importar en aplicación de Roar
Guía paso a paso como crear e importar en aplicación de Roar
 
Guia para compartir recursos en goconcr
Guia para compartir recursos en goconcrGuia para compartir recursos en goconcr
Guia para compartir recursos en goconcr
 
Secuencia didáctica 3to optativa de produccionMultimedia I
Secuencia didáctica 3to  optativa de produccionMultimedia ISecuencia didáctica 3to  optativa de produccionMultimedia I
Secuencia didáctica 3to optativa de produccionMultimedia I
 
Secuencia didáctica 6to web y redes aplicadas a las artes
Secuencia didáctica 6to web y redes aplicadas a las artesSecuencia didáctica 6to web y redes aplicadas a las artes
Secuencia didáctica 6to web y redes aplicadas a las artes
 
Añadir un Gadget en HTML en Blog
Añadir un Gadget en HTML en BlogAñadir un Gadget en HTML en Blog
Añadir un Gadget en HTML en Blog
 
Fotovoz photovoice rt
Fotovoz photovoice rtFotovoz photovoice rt
Fotovoz photovoice rt
 
¿Qué es un Weblog / Blog?
¿Qué es un Weblog / Blog?¿Qué es un Weblog / Blog?
¿Qué es un Weblog / Blog?
 
Wiki
WikiWiki
Wiki
 
Uso educativo de los wikis
Uso educativo de los wikisUso educativo de los wikis
Uso educativo de los wikis
 
Empleo de Wikis como apoyo en desarrollo colaborativo de ejercicios
Empleo de Wikis como apoyo en desarrollo colaborativo de ejerciciosEmpleo de Wikis como apoyo en desarrollo colaborativo de ejercicios
Empleo de Wikis como apoyo en desarrollo colaborativo de ejercicios
 
El uso de las Webquest, los Blogs y las Wiki en la docencia universitaria
El uso de las Webquest, los Blogs y las Wiki en la docencia universitariaEl uso de las Webquest, los Blogs y las Wiki en la docencia universitaria
El uso de las Webquest, los Blogs y las Wiki en la docencia universitaria
 
Revista ejemplo
Revista ejemploRevista ejemplo
Revista ejemplo
 
Presentavideomarcadeagua
PresentavideomarcadeaguaPresentavideomarcadeagua
Presentavideomarcadeagua
 
Tres puntos primordiales para identificar fuentes confiables en artículos y ...
Tres puntos primordiales para identificar fuentes confiables en artículos y ...Tres puntos primordiales para identificar fuentes confiables en artículos y ...
Tres puntos primordiales para identificar fuentes confiables en artículos y ...
 
Guía a la redacción en el estilo APA, 6ta edición
Guía a la redacción en el estilo APA, 6ta ediciónGuía a la redacción en el estilo APA, 6ta edición
Guía a la redacción en el estilo APA, 6ta edición
 
Educacion con TICS
Educacion con TICSEducacion con TICS
Educacion con TICS
 

Kürzlich hochgeladen

TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptx
TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptxTECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptx
TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptxFranciscoCruz296518
 
Programación Anual 2024 - CIENCIAS SOCIALES.docx
Programación Anual 2024  - CIENCIAS SOCIALES.docxProgramación Anual 2024  - CIENCIAS SOCIALES.docx
Programación Anual 2024 - CIENCIAS SOCIALES.docxJhordanBenitesSanche1
 
Presentación del tema: tecnología educativa
Presentación del tema: tecnología educativaPresentación del tema: tecnología educativa
Presentación del tema: tecnología educativaricardoruizaleman
 
explicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptexplicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptjosemanuelcremades
 
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.docGLADYSPASTOR
 
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaLa poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaIGNACIO BALLESTER PARDO
 
Kirpi-el-erizo libro descargar pdf 1 link
Kirpi-el-erizo libro descargar pdf 1 linkKirpi-el-erizo libro descargar pdf 1 link
Kirpi-el-erizo libro descargar pdf 1 linkMaximilianoMaldonado17
 
Los escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialesLos escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialeshanda210618
 
U2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfU2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfJavier Correa
 
Xardín de San Carlos (A Coruña) IES Monelos
Xardín de San Carlos (A Coruña) IES MonelosXardín de San Carlos (A Coruña) IES Monelos
Xardín de San Carlos (A Coruña) IES MonelosAgrela Elvixeo
 
PPT Protocolo de desregulación emocional.pptx
PPT Protocolo de desregulación emocional.pptxPPT Protocolo de desregulación emocional.pptx
PPT Protocolo de desregulación emocional.pptxKarenSepulveda23
 
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdf
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdfAnna Llenas Serra. El monstruo de colores. Doctor de emociones.pdf
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdfSaraGabrielaPrezPonc
 
ficha de aplicacion para estudiantes El agua para niños de primaria
ficha de aplicacion para estudiantes El agua para niños de primariaficha de aplicacion para estudiantes El agua para niños de primaria
ficha de aplicacion para estudiantes El agua para niños de primariamichel carlos Capillo Dominguez
 
Tecnología educativa en la era actual .pptx
Tecnología educativa en la era actual .pptxTecnología educativa en la era actual .pptx
Tecnología educativa en la era actual .pptxJulioSantin2
 
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLA
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLAEL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLA
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLAJAVIER SOLIS NOYOLA
 
Recursos Tecnológicos, página AIP-CRT 2 0 2 4.pdf
Recursos Tecnológicos, página  AIP-CRT 2 0 2 4.pdfRecursos Tecnológicos, página  AIP-CRT 2 0 2 4.pdf
Recursos Tecnológicos, página AIP-CRT 2 0 2 4.pdfNELLYKATTY
 
Revista digital primer ciclo 2024 colección ediba
Revista digital primer ciclo 2024 colección edibaRevista digital primer ciclo 2024 colección ediba
Revista digital primer ciclo 2024 colección edibaTatiTerlecky1
 
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..La Gatera de la Villa nº 51. Revista cultural sobre Madrid..
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..La Gatera de la Villa
 
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAPROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAJoaqunSolrzano
 

Kürzlich hochgeladen (20)

TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptx
TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptxTECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptx
TECNOLOGÍA EDUCATIVA, USO DE LAS TIC.pptx
 
Programación Anual 2024 - CIENCIAS SOCIALES.docx
Programación Anual 2024  - CIENCIAS SOCIALES.docxProgramación Anual 2024  - CIENCIAS SOCIALES.docx
Programación Anual 2024 - CIENCIAS SOCIALES.docx
 
Presentación del tema: tecnología educativa
Presentación del tema: tecnología educativaPresentación del tema: tecnología educativa
Presentación del tema: tecnología educativa
 
Power Point E. Sab: Adoración sin fin...
Power Point E. Sab: Adoración sin fin...Power Point E. Sab: Adoración sin fin...
Power Point E. Sab: Adoración sin fin...
 
explicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.pptexplicacionsobrelasemanasanta-190411100653.ppt
explicacionsobrelasemanasanta-190411100653.ppt
 
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
5°-CARPETA PEDAGÓGICA 2024-MAESTRAS DE PRIMARIA PERÚ-978387435.doc
 
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didácticaLa poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
La poesía del encarcelamiento de Raúl Zurita en el aula: una propuesta didáctica
 
Kirpi-el-erizo libro descargar pdf 1 link
Kirpi-el-erizo libro descargar pdf 1 linkKirpi-el-erizo libro descargar pdf 1 link
Kirpi-el-erizo libro descargar pdf 1 link
 
Los escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comercialesLos escritos administrativos, técnicos y comerciales
Los escritos administrativos, técnicos y comerciales
 
U2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdfU2_EA2_descargable TICS PRESENCIAL 2.pdf
U2_EA2_descargable TICS PRESENCIAL 2.pdf
 
Xardín de San Carlos (A Coruña) IES Monelos
Xardín de San Carlos (A Coruña) IES MonelosXardín de San Carlos (A Coruña) IES Monelos
Xardín de San Carlos (A Coruña) IES Monelos
 
PPT Protocolo de desregulación emocional.pptx
PPT Protocolo de desregulación emocional.pptxPPT Protocolo de desregulación emocional.pptx
PPT Protocolo de desregulación emocional.pptx
 
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdf
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdfAnna Llenas Serra. El monstruo de colores. Doctor de emociones.pdf
Anna Llenas Serra. El monstruo de colores. Doctor de emociones.pdf
 
ficha de aplicacion para estudiantes El agua para niños de primaria
ficha de aplicacion para estudiantes El agua para niños de primariaficha de aplicacion para estudiantes El agua para niños de primaria
ficha de aplicacion para estudiantes El agua para niños de primaria
 
Tecnología educativa en la era actual .pptx
Tecnología educativa en la era actual .pptxTecnología educativa en la era actual .pptx
Tecnología educativa en la era actual .pptx
 
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLA
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLAEL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLA
EL ECLIPSE DE LA PAZ (cuento literario). Autor y diseñador JAVIER SOLIS NOYOLA
 
Recursos Tecnológicos, página AIP-CRT 2 0 2 4.pdf
Recursos Tecnológicos, página  AIP-CRT 2 0 2 4.pdfRecursos Tecnológicos, página  AIP-CRT 2 0 2 4.pdf
Recursos Tecnológicos, página AIP-CRT 2 0 2 4.pdf
 
Revista digital primer ciclo 2024 colección ediba
Revista digital primer ciclo 2024 colección edibaRevista digital primer ciclo 2024 colección ediba
Revista digital primer ciclo 2024 colección ediba
 
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..La Gatera de la Villa nº 51. Revista cultural sobre Madrid..
La Gatera de la Villa nº 51. Revista cultural sobre Madrid..
 
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍAPROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
PROGRAMACIÓN CURRICULAR ANUAL DE CIENCIA Y TECNOLOGÍA
 

Comando y ejercicios para HTML

  • 1. Creación de páginas web. Lenguaje HTML > HTML,siglas de HyperTextMarkup Language («lenguaje de marcas de hipertexto»), Ejercicios de Lenguaje HTML (I) Ejercicio 1 1.- Abre el Bloc de Notas y escribe el siguiente texto: <HTML> <HEAD> <TITLE>Mi primera página</TITLE> <HEAD> <BODY> <CENTER><H1>Mi primera página</H1></CENTER> <HR> <P>Esta es mi primera página </BODY> </HTML> 2.- Guárdalo con el nombre mipag01tunombre.html 3.- Arranca el navegador y abre el fichero que acabas de crear. Ejercicio 2 Edita el fichero mipag01tunombre.html y pon el siguiente cuerpo a la página. <H1>TÍTULO 1</H1> <H2>TÍTULO 2</H2> <H3>TÍTULO 3</H3> <H4>TÍTULO 4</H4> <H5>TÍTULO 5</H5> <H6>TÍTULO 6</H6>
  • 2. Sálvalo con el nombre mipag02tunombre.html y luego ábrelo con el navegador. Ejercicio 3 1.- Edita el fichero mipag01.html y pon en el cuerpo dos o tres párrafos (de tres o cuatro líneas caada párrafo) tomados del artículo de la energía en Andalucía. Separa los párrafos sin poner etiquetas, sólo pulsando Intro una o dos veces. Sálvalo, y luego edítalo con tu navegador. Observa que los párrafos se ven juntos. 2.- Sigue con la edición del fichero, pon las etiquetas <P> a cada párrafo. Sálva el fichero y ábrelo con el navegador. 3.- Aumenta la separación entre párrafos con <BR> y <P>. Ejercicio 4: Para comprobar cómo se pueden alinear textos. 1.- Edita el fichero mipag01tunombre.html y justifica todos los párrafos con <DIV align=justify>. Comprueba en el navegador la presentación.
  • 3. 2.- Ahora centra el párrafo y ajusta a la derecha el segundo. Comprueba el resultado. Ejercicio 5: Para cambiar el aspecto de la letra 1.- Edita el fichero mipagina01tunombre.html y pon a las frases del primer párrafo las etiquetas adecuadas para que aparezcan en negrita, cursiva y teletipo. 2.- Usa la etiqueta <FONT> con size = 1,2, etc., para tener las primeras palabras del segundo párrafo en tamaño creciente. 3. Ahora usa la etiqueta <FONT> con size = + 1, - 1, + 2, - 2, etc. para tener las primeras palabras del segundo párrafo en tamaño creciente y decreciente.
  • 4. Ejercicio 6: Para comprobar los parámetros de los colores. Guía de colores Black Silver Gray White Maroon Red Purple Fuchsia Green Lime Olive Yellow Navy Blue Teal Aqua 1.- Haz un fichero colores01tunombre.html con varias líneas como la siguiente, una para cada uno de los colores de la tabla anterior. <FONT color=”red”>Rojo</FONT> Ejercicio 7: 1.- Haz un fichero colores02tunombre.html con el siguiente texto: <FONT COLOR=”#FF0000”>Rojo 100%</FONT> <FONT COLOR=”#8F0000”>Rojo 50%</FONT> <FONT COLOR=”#4F0000”>Rojo 25%</FONT><P> <FONT COLOR=”#00FF00”>Verde 100%</FONT> <FONT COLOR=”#008F00”>Verde 50%</FONT> <FONT COLOR=”#004F00”>Verde 25%</FONT><P> <FONT COLOR=”#0000FF”>Azul 100%</FONT> <FONT COLOR=”#00008F”>Azul 50%</FONT> <FONT COLOR=”#00004F”>Azul 25%</FONT> Sálvalo y léelo en tu navegador. 2.- Cambia los colores RGB anteriores y observa los resultados. 3.- Experimenta con los códigos para obtener el color amarillo. Ejercicio 8: Para comprobar cómo hacer hipertexto.
  • 5. Los mecanismos más usados son los siguientes: 1.- Haz una página llamada interesantesminombre.html donde poner enlaces a sitios interesantes. Por ejemplo, puedes empezar con el siguiente texto: <HTML> <HEAD> <meta http-equiv=”Content-Type” content=”text/html; char- set=ISO-8559-1”> <TITLE>Sitios de interés</TITLE> </HEAD> <BODY> <CENTER> <H1>Mis páginas favoritas</H1> </CENTER> <HR> Estas son mis páginas favoritas: <P><A HREF=”http://www.google.es”>Google</A> <BR> <A HREF=”http://www.juntadeandalucia.es/averroes/iesalfonso_romero_barcojo”>IES Alfonso Romero Barcojo</A> </BODY> </HTML> Ejercicio 9: Para comprobar cómo se hacen listas. Listas desordenadas:
  • 6. Listas ordenadas: Ejercicio 10: Haz una lista desordenada con los nombres:Desayuno, almuerzo, Merienda y Cena. Convierte en ordenada la lista anterior. Ejercicio 11: Para incluir gráficos e imágenes en unestras páginas utilizaremos la etiqueta <IMG> de esta manera: <IMG SRC="fichero_grafico"" ALT="description" El parámetro SRC especifica el nombre del fihero que contiene el gráfico. Los formatos de imagen deben ser
  • 7. JGP o GIF. El parámetro ALT especifica el texto que se mostrará en lugar del gráfico en aquellos navegadores que no lo muestren. Con los parámetros HEIGHT y WIDTH se puede indicar siempre: la altura y la anchura del gráfico en píxeles. <IMG SRC="animales/gato.jpg" ALT="Gato" Width=100 Height=145 El nombre del fichero imagen debe hacer referencia ala carpeta de origen del mismo. No se pondrá si ésta es la misma que la del documento HTML que estamos elaborando. Se puede alinear una imagen a la izquierda o a la derecha de la página. Esto se consigue con los parámetros ALIGN= RIGHT (imagen a la derecha) y ALIGN=LEFT (la imagen queda a la izquierda). También se puede poner una imagen como fondo de toda la página. Esto se consigue poniendo el parámetro BACKGRONUD="imagen" en la etiqueta <BODY>, siendo imagen el nombre del fichero gráfico GIF o JPG. <BODY BACKGROUND="animales/gato.gif"> Apoyándote en la explicación anterior, edita el archivo del ejercicio nº 3 e inserta una imagen centrada detrás de cada párrafo. Ejercicio 12: Edita el archivo nº 6 y coloca como imagen de fondo de la página una paleta de colores que captures en Internet. Caráct er Entidad HTML Caráct er Entidad HTML á &aacute; Á &Aacute; é &eacute; É &Eacute; í &iacute; Í &Iacute; ó &oacute; Ó &Oacute; ú &uacute; Ú &Uacute; ü &uuml; Ü &Uuml; ñ &ntilde; Ñ &Ntilde; ¡ &iexcl; ¿ &iquest;