SlideShare a Scribd company logo
1 of 24
Download to read offline
Carrera de Informática
Edwin Patricio Cocha
Manual de html
• HTML, siglas de HyperText Markup
  Language («lenguaje de marcado de hipertexto»), hace
  referencia al lenguaje de marcado predominante para la
  elaboración de páginas web que se utiliza para describir
  y traducir la estructura y la información en forma de
  texto, así como para complementar el texto con objetos
  tales como imágenes.
• Un documento HTML comienza con la etiqueta <html>, y
  termina con </html>. Dentro del documento (entre las
  etiquetas de principio y fin de html), hay dos zonas bien
  diferenciadas: el encabezamiento, delimitado
  por<head> y </head>, que sirve para definir diversos
  valores válidos en todo el documento; y el cuerpo,
  delimitado por <body> y </body>, donde reside la
  información del documento.
• La única utilidad del encabezamiento en la que nos
  detendremos es la directiva <title>, que permite
  especificar el título de un documento HTML. Este título
  no forma parte del documento en sí: no aparece, por
  ejemplo, al principio del documento una vez que este se
  presenta con un programa adecuado, sino que suele
  servir como título de la ventana del programa que nos la
  muestra. Por ejemplo, en el encabezamiento de este
  manual se ha especificado:
• <title>Manual práctico de HTML</title>en minúsculas.
  Obsérverse que el título que encabeza este texto se ha
  escrito con mayúsculas, para distinguirlo del
  título global del documento.
• El cuerpo de un documento HTML contiene el texto que,
  con la presentación y los efectos que se decidan, se
  presentará ante el hiperlector. Dentro del cuerpo son
  aplicables todos los efectos que se van a mencionar en
  el resto de esta guía. Dichos efectos se especifican
  exclusivamente a través de directivas. Esto quiere decir
  que los espacios, tabulaciones y retornos de carro que
  se introduzcan en el fichero fuente no tienen ningún
  efecto a la hora de la presentación final del documento.
  Por ejemplo, escribiendo:
• Estas palabras forman una frase. producimos
  exactamente lo mismo que con:
• Estas       palabras      forman       una frase.
• A la hora de la verdad lo que se ve es: Estas palabras
  forman una frase.
• En resumen, la estructura básica de un documento
  HTML queda de la forma siguiente:
• <html>
•  <head>
•  <title>Título</title>
• </head> <body>
• Texto del documento, menciones a gráficos, enlaces, etc.
  </body>
• </html>
• Como ya hemos dicho, la estructura lógica del texto y los
  diferentes efectos que se le apliquen se especifican
  mediante directivas. En este punto vamos a repasar
  algunas de las más importantes. En cada uno de los
  casos que veremos, primero se presenta el texto original
  HTML, es decir, lo que nosotros editamos, con las
  directivas situadas en los lugares adecuados; y después
  se presenta el efecto que dicho texto fuente produce una
  vez que se interpreta y se representa con el programa
  adecuado.
• Mediante los títulos, en sus diferentes niveles de
  importancia, podemos definir el esqueleto del
  documento, su estructura básica.
• <h1>Mucha importancia</h1>
• Mucha importancia
• <h2>Menos importancia</h2>
• Menos importancia
• <h3>Mucha menos importancia</h3>
• Mucha menos importancia
• Mediante estos atributos determinamos el estilo y el tipo
  de letra que tendrá la presentación del documento final.
  El primero en el que nos deberíamos detener es el texto
  normal entendiendo como tal el que no tiene ninguna
  característica especial. Para definir un párrafo
  como normal no es necesario poner ninguna etiqueta. Lo
  único que hay que tener en cuenta, como ya se ha dicho
  antes, es que al presentar el documento se hace caso
  omiso de los espacios, tabulaciones y retornos de carro
  que se encuentren en el texto fuente. Por ello cuando se
  quiera forzar un final de línea es necesario utilizar dos
  directivas especiales:
• <p> para marcar un fin de párrafo, y <br> para un único
  retorno de carro. La diferencia entre ambas es que la
  separación de líneas que provoca<p> es algo mayor que
  la de <br>, para que los párrafos se distingan bien entre
  sí. Las dos directivas mencionadas se sitúan en el punto
  en que queremos poner la separación. Por ejemplo:
• Este será un texto normal (párrafo 1, línea 1).<br>
• El primer párrafo estará formado por 2 líneas (párrafo 1,
  línea. <p>
• Este ya es el segundo párrafo (párrafo 2, línea 1).<p>
• Este será un texto normal (párrafo 1, línea 1).
• El primer párrafo estará formado por 2 líneas (párrafo 1,
  línea 2).
• Este ya es el segundo párrafo (párrafo 2, línea 1).
• Por supuesto, estas dos etiquetas se puede aplicar
  donde queramos, no sólo en el texto normal.
• El texto preformateado (etiqueta <pre>) se aplica cuando
  queremos que en la presentación final del documento se
  respeten los espacios y retornos de carro que hayamos
  puesto en el texto fuente. Además se utilizará un tipo de
  letra de espaciado fijo, parecido al de una máquina de
  escribir, más pequeño que el del texto normal. Este estilo
  de texto puede ser adecuado, por ejemplo, para una
  tabla numérica sencilla:
•   <pre> Texto preformateado
•   ---------------------
•    |1|2|3|4|
•    |5|6|7|8|
•    | 9 | 10 | 11 | 12 |
•   ---------------------
•   </pre>Texto preformateado
•   ---------------------
•   |1|2|3|4|
•   |5|6|7|8|
•   | 9 | 10 | 11 | 12 |
•   ---------------------
• Esto en negrita y esto en cursiva Se puede utilizar un
  tipo de letra similar al de una máquina de escribir:
• <tt>Máquina de escribir</tt>
• Máquina de escribir Para centrar texto (o, en general,
  cualquier cosa: un gráfico, por ejemplo) se usa la
  directiva <center>:
• <center>Verde que te quiero verde</center>
                 • Verde que te quiero verde
• Las listas se definen de forma muy sencilla: se dice
  dónde empieza la lista, dónde empieza cada punto y
  dónde acaba la lista. Las etiquetas que se utilicen en
  cada caso deben aparecer al principio de línea, o al
  menos sin texto por delante (sólo espacios o
  tabulaciones).Podemos recurrir a tres tipos distintos de
  listas, cada una con una presentación diferente: no
  numeradas, numeradas y listas de definiciones
  (glosarios).
• Las listas se pueden anidar, es decir, en el lugar donde
  debería ir uno de los términos de la lista se pone una
  nueva lista, que por supuesto no tiene porqué ser del
  mismo tipo.
• Esto es una lista no numerada:
•   <ul>
•   <li>Tomates
•   <li>Zanahorias
•   <li>Puerros
•   </ul>

• Tomates
• Zanahorias
• Puerros
•   <ol>
•   <li>Miguel Induráin
•   <li>Tony Rominger
•   <li>Eugeni Berzin
•   </ol>

1. Miguel Induráin
2. Tony Rominger
3. Eugeni Berzin
• MARQUEE
• La etiqueta <MARQUEE></MARQUEE> crea una
  marquesina con un texto en su interior que se desplaza.
• Funciona unicamente con Ms-Explorer. Sus parámetros
  son los siguientes :
• align = top / middle / bottom Indica si el texto del interior
  de la marquesina se alinea en la zona alta (top), en la
  baja (bottom) o en el centro (middle) de la misma.
• bgcolor = "codigo de color" Indica el color del fondo de
  la marquesina.
• direction = left / right Indica hacia que lugar se desplaza
  el texto, hacia la izquierda (left) o hacia la derecha (right)

• height = num o % Indica la altura de la marquesina en
  puntos o porcentaje en función de la ventana del
  navegador.

• width = num o % Indica la anchura de la marquesina en
  puntos o porcentaje en función de la ventana del
  navegador.
• loop = num / infinite Indica el numero de veces que se
  desplazará el texto por la marquesina. Si se indica
  infinite, se desplazará indefinidamente.
• scrolldelay = num. Indica el número de milisegundos
  que tarda en reescribirse el texto por la marquesina, a
  mayor número mas lentamente se desplazará el texto.
• Veamos un ejemplo de esta etiqueta :

• <MARQUEE bgcolor = "#FFFFFF" width
  = 50% scrolldelay = 0 > Bienvenido a mi pagina
  personal en Internet.
  </MARQUEE>
Manual de html

More Related Content

What's hot (19)

HTML
HTMLHTML
HTML
 
Html apunte 2
Html apunte 2Html apunte 2
Html apunte 2
 
Etiquetas Diapositivas.
Etiquetas Diapositivas.Etiquetas Diapositivas.
Etiquetas Diapositivas.
 
Conceptos básicos Html
Conceptos básicos HtmlConceptos básicos Html
Conceptos básicos Html
 
Inicio al HTML
Inicio al HTMLInicio al HTML
Inicio al HTML
 
Conceptos básicos y etiquetas
Conceptos básicos y etiquetasConceptos básicos y etiquetas
Conceptos básicos y etiquetas
 
Etiquetas HTML
Etiquetas HTMLEtiquetas HTML
Etiquetas HTML
 
Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1 Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
2. html
2. html2. html
2. html
 
Lenguaje html para colegio
Lenguaje html para colegioLenguaje html para colegio
Lenguaje html para colegio
 
html
htmlhtml
html
 
Html Exposicion
Html ExposicionHtml Exposicion
Html Exposicion
 
Html
HtmlHtml
Html
 
HTML 2011
HTML 2011HTML 2011
HTML 2011
 
Portales ud4 - lenguaje html
Portales   ud4 - lenguaje htmlPortales   ud4 - lenguaje html
Portales ud4 - lenguaje html
 
Html Bas
Html BasHtml Bas
Html Bas
 
Html
HtmlHtml
Html
 
Html-CSS
Html-CSSHtml-CSS
Html-CSS
 

Viewers also liked (16)

Manual html
Manual htmlManual html
Manual html
 
Html y html 5
Html y html 5Html y html 5
Html y html 5
 
Diseño de páginas web
Diseño de páginas webDiseño de páginas web
Diseño de páginas web
 
Mi primera página web
Mi primera página webMi primera página web
Mi primera página web
 
Guia rapida html
Guia rapida htmlGuia rapida html
Guia rapida html
 
Manual html
Manual htmlManual html
Manual html
 
Etiquetas básicas en html
Etiquetas básicas en htmlEtiquetas básicas en html
Etiquetas básicas en html
 
INFORMATICA ETIQUETAS
INFORMATICA ETIQUETASINFORMATICA ETIQUETAS
INFORMATICA ETIQUETAS
 
Html basico
Html basicoHtml basico
Html basico
 
MANUAL BASICO EN HTML
MANUAL BASICO EN HTMLMANUAL BASICO EN HTML
MANUAL BASICO EN HTML
 
Listado etiquetas html 5
Listado etiquetas html 5Listado etiquetas html 5
Listado etiquetas html 5
 
Manual de html
Manual de htmlManual de html
Manual de html
 
Manual user diseño web con html y css
Manual user   diseño web con html y cssManual user   diseño web con html y css
Manual user diseño web con html y css
 
Como realizar estudio de mercado
Como realizar estudio de mercadoComo realizar estudio de mercado
Como realizar estudio de mercado
 
Estudio De Mercado
Estudio De MercadoEstudio De Mercado
Estudio De Mercado
 
Ejemplo power point estudio de mercado
Ejemplo power point  estudio de mercadoEjemplo power point  estudio de mercado
Ejemplo power point estudio de mercado
 

Similar to Manual de html (20)

Programacion en html
Programacion en htmlProgramacion en html
Programacion en html
 
Introhtml
IntrohtmlIntrohtml
Introhtml
 
HTML
HTMLHTML
HTML
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Lenguaje HTML
  Lenguaje HTML  Lenguaje HTML
Lenguaje HTML
 
html
htmlhtml
html
 
HTML
HTMLHTML
HTML
 
Conceptos Etiquetas de HTML
Conceptos Etiquetas de HTMLConceptos Etiquetas de HTML
Conceptos Etiquetas de HTML
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Practicas html
Practicas htmlPracticas html
Practicas html
 
Aprender el lenguaje html
Aprender el lenguaje htmlAprender el lenguaje html
Aprender el lenguaje html
 
Manual de-html
Manual de-htmlManual de-html
Manual de-html
 
HTML
HTMLHTML
HTML
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
emded/Retro2011brandon
emded/Retro2011brandonemded/Retro2011brandon
emded/Retro2011brandon
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 

Recently uploaded

Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptx
Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptxCertificado de Profesionalidad SSCM0108 massiel gutierrez.pptx
Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptxMassiel Gutierrez Espinosa
 
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptx
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptxIMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptx
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptxnelsontobontrujillo
 
Planes y programas - Nivel Secundaria 2024 word.doc
Planes y programas - Nivel Secundaria 2024 word.docPlanes y programas - Nivel Secundaria 2024 word.doc
Planes y programas - Nivel Secundaria 2024 word.docVaniecitaValverde
 
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdf
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdfPROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdf
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdfFRANCISCO PAVON RABASCO
 
EXPERIENCIA DE APRENDIZAJE 3 EPT - SECUNDARIA-2024.docx
EXPERIENCIA DE APRENDIZAJE 3  EPT - SECUNDARIA-2024.docxEXPERIENCIA DE APRENDIZAJE 3  EPT - SECUNDARIA-2024.docx
EXPERIENCIA DE APRENDIZAJE 3 EPT - SECUNDARIA-2024.docxssuser9be75b1
 
Escuela de la Confianza DRELM-MINEDU Ccesa007.pdf
Escuela de la Confianza DRELM-MINEDU  Ccesa007.pdfEscuela de la Confianza DRELM-MINEDU  Ccesa007.pdf
Escuela de la Confianza DRELM-MINEDU Ccesa007.pdfDemetrio Ccesa Rayme
 
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocx
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocxUnidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocx
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocxOlgaLuzFloresGonzale
 
EVALUACIÓN DIAGNÓSTICA 4° GRADO 2024.docx
EVALUACIÓN DIAGNÓSTICA  4°  GRADO 2024.docxEVALUACIÓN DIAGNÓSTICA  4°  GRADO 2024.docx
EVALUACIÓN DIAGNÓSTICA 4° GRADO 2024.docxssuser9be75b1
 
HISTORIA DEL CRISTIANISMO II Clase 6 Ibli
HISTORIA DEL CRISTIANISMO II Clase 6 IbliHISTORIA DEL CRISTIANISMO II Clase 6 Ibli
HISTORIA DEL CRISTIANISMO II Clase 6 IbliIvnLeonardoPiedrahta
 
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdf
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdfROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdf
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdfavitiadgo
 
Actividades El Hombrecito de jengibre.pdf
Actividades El Hombrecito de jengibre.pdfActividades El Hombrecito de jengibre.pdf
Actividades El Hombrecito de jengibre.pdfDaiaJansen
 
El papel de la microbiota en el sistema inmunologico.pptx
El papel de la microbiota en el sistema inmunologico.pptxEl papel de la microbiota en el sistema inmunologico.pptx
El papel de la microbiota en el sistema inmunologico.pptxsanchezjeraldy7757
 
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!12. ¡Promoviendo la Paternidad Responsable en La Recoleta!
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!ProfesorGualberto
 
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...William Henry Vegazo Muro
 
Dia internacional de peliculas iberoamericanas.pptx
Dia internacional de peliculas iberoamericanas.pptxDia internacional de peliculas iberoamericanas.pptx
Dia internacional de peliculas iberoamericanas.pptxxc025079
 
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!11. ¡Promoviendo la Paternidad Responsable en La Recoleta!
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!ProfesorGualberto
 
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!1. ¡Promoviendo la Paternidad Responsable en La Recoleta!
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!ProfesorGualberto
 
Dia internacional de peliculas iberoamericanas.pptx 2
Dia internacional de peliculas iberoamericanas.pptx 2Dia internacional de peliculas iberoamericanas.pptx 2
Dia internacional de peliculas iberoamericanas.pptx 2xc025079
 

Recently uploaded (20)

Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptx
Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptxCertificado de Profesionalidad SSCM0108 massiel gutierrez.pptx
Certificado de Profesionalidad SSCM0108 massiel gutierrez.pptx
 
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptx
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptxIMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptx
IMPORTANCIA DE LA NUTRICIÓN PARA LA VIDA Y LA SALUD.pptx
 
Planes y programas - Nivel Secundaria 2024 word.doc
Planes y programas - Nivel Secundaria 2024 word.docPlanes y programas - Nivel Secundaria 2024 word.doc
Planes y programas - Nivel Secundaria 2024 word.doc
 
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdf
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdfPROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdf
PROGRAMA-XI-SEMANA-DE-LAS-LETRAS-2024.pdf
 
EXPERIENCIA DE APRENDIZAJE 3 EPT - SECUNDARIA-2024.docx
EXPERIENCIA DE APRENDIZAJE 3  EPT - SECUNDARIA-2024.docxEXPERIENCIA DE APRENDIZAJE 3  EPT - SECUNDARIA-2024.docx
EXPERIENCIA DE APRENDIZAJE 3 EPT - SECUNDARIA-2024.docx
 
El anhelo de Dios en Sion, porque nos ama
El anhelo de Dios en Sion, porque nos amaEl anhelo de Dios en Sion, porque nos ama
El anhelo de Dios en Sion, porque nos ama
 
Escuela de la Confianza DRELM-MINEDU Ccesa007.pdf
Escuela de la Confianza DRELM-MINEDU  Ccesa007.pdfEscuela de la Confianza DRELM-MINEDU  Ccesa007.pdf
Escuela de la Confianza DRELM-MINEDU Ccesa007.pdf
 
Repaso Ejercicios Pruebas CRECE-PR-2024.pptx
Repaso Ejercicios Pruebas CRECE-PR-2024.pptxRepaso Ejercicios Pruebas CRECE-PR-2024.pptx
Repaso Ejercicios Pruebas CRECE-PR-2024.pptx
 
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocx
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocxUnidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocx
Unidad 00 CIENCIA Y TECNOLOGÍA. sesión de bienvenidadocx
 
EVALUACIÓN DIAGNÓSTICA 4° GRADO 2024.docx
EVALUACIÓN DIAGNÓSTICA  4°  GRADO 2024.docxEVALUACIÓN DIAGNÓSTICA  4°  GRADO 2024.docx
EVALUACIÓN DIAGNÓSTICA 4° GRADO 2024.docx
 
HISTORIA DEL CRISTIANISMO II Clase 6 Ibli
HISTORIA DEL CRISTIANISMO II Clase 6 IbliHISTORIA DEL CRISTIANISMO II Clase 6 Ibli
HISTORIA DEL CRISTIANISMO II Clase 6 Ibli
 
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdf
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdfROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdf
ROSAURA REVUELTAS, ESPERANZA Y LA SAL DE LA TIERRA (1).pdf
 
Actividades El Hombrecito de jengibre.pdf
Actividades El Hombrecito de jengibre.pdfActividades El Hombrecito de jengibre.pdf
Actividades El Hombrecito de jengibre.pdf
 
El papel de la microbiota en el sistema inmunologico.pptx
El papel de la microbiota en el sistema inmunologico.pptxEl papel de la microbiota en el sistema inmunologico.pptx
El papel de la microbiota en el sistema inmunologico.pptx
 
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!12. ¡Promoviendo la Paternidad Responsable en La Recoleta!
12. ¡Promoviendo la Paternidad Responsable en La Recoleta!
 
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...
2024-orientaciones-para-la-evaluacion-diagnostica-2024-en-las-iiee-publicas-d...
 
Dia internacional de peliculas iberoamericanas.pptx
Dia internacional de peliculas iberoamericanas.pptxDia internacional de peliculas iberoamericanas.pptx
Dia internacional de peliculas iberoamericanas.pptx
 
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!11. ¡Promoviendo la Paternidad Responsable en La Recoleta!
11. ¡Promoviendo la Paternidad Responsable en La Recoleta!
 
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!1. ¡Promoviendo la Paternidad Responsable en La Recoleta!
1. ¡Promoviendo la Paternidad Responsable en La Recoleta!
 
Dia internacional de peliculas iberoamericanas.pptx 2
Dia internacional de peliculas iberoamericanas.pptx 2Dia internacional de peliculas iberoamericanas.pptx 2
Dia internacional de peliculas iberoamericanas.pptx 2
 

Manual de html

  • 3. • HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), hace referencia al lenguaje de marcado predominante para la elaboración de páginas web que se utiliza para describir y traducir la estructura y la información en forma de texto, así como para complementar el texto con objetos tales como imágenes.
  • 4. • Un documento HTML comienza con la etiqueta <html>, y termina con </html>. Dentro del documento (entre las etiquetas de principio y fin de html), hay dos zonas bien diferenciadas: el encabezamiento, delimitado por<head> y </head>, que sirve para definir diversos valores válidos en todo el documento; y el cuerpo, delimitado por <body> y </body>, donde reside la información del documento.
  • 5. • La única utilidad del encabezamiento en la que nos detendremos es la directiva <title>, que permite especificar el título de un documento HTML. Este título no forma parte del documento en sí: no aparece, por ejemplo, al principio del documento una vez que este se presenta con un programa adecuado, sino que suele servir como título de la ventana del programa que nos la muestra. Por ejemplo, en el encabezamiento de este manual se ha especificado:
  • 6. • <title>Manual práctico de HTML</title>en minúsculas. Obsérverse que el título que encabeza este texto se ha escrito con mayúsculas, para distinguirlo del título global del documento.
  • 7. • El cuerpo de un documento HTML contiene el texto que, con la presentación y los efectos que se decidan, se presentará ante el hiperlector. Dentro del cuerpo son aplicables todos los efectos que se van a mencionar en el resto de esta guía. Dichos efectos se especifican exclusivamente a través de directivas. Esto quiere decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el fichero fuente no tienen ningún efecto a la hora de la presentación final del documento. Por ejemplo, escribiendo:
  • 8. • Estas palabras forman una frase. producimos exactamente lo mismo que con: • Estas palabras forman una frase. • A la hora de la verdad lo que se ve es: Estas palabras forman una frase. • En resumen, la estructura básica de un documento HTML queda de la forma siguiente:
  • 9. • <html> • <head> • <title>Título</title> • </head> <body> • Texto del documento, menciones a gráficos, enlaces, etc. </body> • </html>
  • 10. • Como ya hemos dicho, la estructura lógica del texto y los diferentes efectos que se le apliquen se especifican mediante directivas. En este punto vamos a repasar algunas de las más importantes. En cada uno de los casos que veremos, primero se presenta el texto original HTML, es decir, lo que nosotros editamos, con las directivas situadas en los lugares adecuados; y después se presenta el efecto que dicho texto fuente produce una vez que se interpreta y se representa con el programa adecuado.
  • 11. • Mediante los títulos, en sus diferentes niveles de importancia, podemos definir el esqueleto del documento, su estructura básica. • <h1>Mucha importancia</h1> • Mucha importancia • <h2>Menos importancia</h2> • Menos importancia • <h3>Mucha menos importancia</h3> • Mucha menos importancia
  • 12. • Mediante estos atributos determinamos el estilo y el tipo de letra que tendrá la presentación del documento final. El primero en el que nos deberíamos detener es el texto normal entendiendo como tal el que no tiene ninguna característica especial. Para definir un párrafo como normal no es necesario poner ninguna etiqueta. Lo único que hay que tener en cuenta, como ya se ha dicho antes, es que al presentar el documento se hace caso omiso de los espacios, tabulaciones y retornos de carro que se encuentren en el texto fuente. Por ello cuando se quiera forzar un final de línea es necesario utilizar dos directivas especiales:
  • 13. • <p> para marcar un fin de párrafo, y <br> para un único retorno de carro. La diferencia entre ambas es que la separación de líneas que provoca<p> es algo mayor que la de <br>, para que los párrafos se distingan bien entre sí. Las dos directivas mencionadas se sitúan en el punto en que queremos poner la separación. Por ejemplo: • Este será un texto normal (párrafo 1, línea 1).<br> • El primer párrafo estará formado por 2 líneas (párrafo 1, línea. <p> • Este ya es el segundo párrafo (párrafo 2, línea 1).<p>
  • 14. • Este será un texto normal (párrafo 1, línea 1). • El primer párrafo estará formado por 2 líneas (párrafo 1, línea 2). • Este ya es el segundo párrafo (párrafo 2, línea 1). • Por supuesto, estas dos etiquetas se puede aplicar donde queramos, no sólo en el texto normal.
  • 15. • El texto preformateado (etiqueta <pre>) se aplica cuando queremos que en la presentación final del documento se respeten los espacios y retornos de carro que hayamos puesto en el texto fuente. Además se utilizará un tipo de letra de espaciado fijo, parecido al de una máquina de escribir, más pequeño que el del texto normal. Este estilo de texto puede ser adecuado, por ejemplo, para una tabla numérica sencilla:
  • 16. <pre> Texto preformateado • --------------------- • |1|2|3|4| • |5|6|7|8| • | 9 | 10 | 11 | 12 | • --------------------- • </pre>Texto preformateado • --------------------- • |1|2|3|4| • |5|6|7|8| • | 9 | 10 | 11 | 12 | • ---------------------
  • 17. • Esto en negrita y esto en cursiva Se puede utilizar un tipo de letra similar al de una máquina de escribir: • <tt>Máquina de escribir</tt> • Máquina de escribir Para centrar texto (o, en general, cualquier cosa: un gráfico, por ejemplo) se usa la directiva <center>: • <center>Verde que te quiero verde</center> • Verde que te quiero verde
  • 18. • Las listas se definen de forma muy sencilla: se dice dónde empieza la lista, dónde empieza cada punto y dónde acaba la lista. Las etiquetas que se utilicen en cada caso deben aparecer al principio de línea, o al menos sin texto por delante (sólo espacios o tabulaciones).Podemos recurrir a tres tipos distintos de listas, cada una con una presentación diferente: no numeradas, numeradas y listas de definiciones (glosarios). • Las listas se pueden anidar, es decir, en el lugar donde debería ir uno de los términos de la lista se pone una nueva lista, que por supuesto no tiene porqué ser del mismo tipo. • Esto es una lista no numerada:
  • 19. <ul> • <li>Tomates • <li>Zanahorias • <li>Puerros • </ul> • Tomates • Zanahorias • Puerros
  • 20. <ol> • <li>Miguel Induráin • <li>Tony Rominger • <li>Eugeni Berzin • </ol> 1. Miguel Induráin 2. Tony Rominger 3. Eugeni Berzin
  • 21. • MARQUEE • La etiqueta <MARQUEE></MARQUEE> crea una marquesina con un texto en su interior que se desplaza. • Funciona unicamente con Ms-Explorer. Sus parámetros son los siguientes : • align = top / middle / bottom Indica si el texto del interior de la marquesina se alinea en la zona alta (top), en la baja (bottom) o en el centro (middle) de la misma. • bgcolor = "codigo de color" Indica el color del fondo de la marquesina.
  • 22. • direction = left / right Indica hacia que lugar se desplaza el texto, hacia la izquierda (left) o hacia la derecha (right) • height = num o % Indica la altura de la marquesina en puntos o porcentaje en función de la ventana del navegador. • width = num o % Indica la anchura de la marquesina en puntos o porcentaje en función de la ventana del navegador.
  • 23. • loop = num / infinite Indica el numero de veces que se desplazará el texto por la marquesina. Si se indica infinite, se desplazará indefinidamente. • scrolldelay = num. Indica el número de milisegundos que tarda en reescribirse el texto por la marquesina, a mayor número mas lentamente se desplazará el texto. • Veamos un ejemplo de esta etiqueta : • <MARQUEE bgcolor = "#FFFFFF" width = 50% scrolldelay = 0 > Bienvenido a mi pagina personal en Internet. </MARQUEE>