Programación Web I - ISC - UCQ - Presentación 04
-
Upload
giovanni-orozco -
Category
Education
-
view
120 -
download
5
Transcript of Programación Web I - ISC - UCQ - Presentación 04
![Page 1: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/1.jpg)
HyperText Markup Language - Lenguaje de marcado de hipertexto
HTML es un 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.
![Page 2: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/2.jpg)
El HTML se escribe en forma de etiquetas o TAGs, contenidas dentro de corchetes angulares (< y >).
htmlhead
title Ejemplo /title/headbody
p Ejemplo /p/body
/html
![Page 3: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/3.jpg)
Los caracteres especiales se deben convertir en HTML para mostrarse correctamente en un navegador.
Carácter Código HTML
á á
é é
í í
ó ó
ú ú
ü ü
ñ ñ
¡ ¡
Carácter Código HTML
Á Á
É É
Í Í
Ó Ó
Ú Ú
Ü Ü
Ñ Ñ
¿ ¿
![Page 4: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/4.jpg)
Los atributos se incluyen dentro de la etiqueta de apertura para añadir información adicional sobre el elemento.
Se expresan de la forma: atributo=”valor”
Un elemento HTML está compuesto por una etiqueta de apertura, los atributos, el contenido y la etiqueta de cierre. Estos elementos se aplican al contenido del documento para cambiar la forma en que el navegador interpretará esa información en la pantalla.
<etiqueta atributo=”valor”>contenido</etiqueta>
![Page 5: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/5.jpg)
El lenguaje HTML original es muy permisivo con su sintaxis y aunque esto pueda parecer algo bueno (flexible) no lo es, pues trae como resultado páginas desordenadas, difíciles de modificar y poco profesionales.
![Page 6: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/6.jpg)
Reglas:
1. Las etiquetas se cierran en el mismo orden en que se abren:
2. Los nombres de las etiquetas y sus atributos se escriben preferentemente en minúsculas:
3. Los atributos van entre comillas:
<html><body>Texto</html></body><html><body>Texto</body></html>
<HTML><BODY>Texto</BODY></HTML><html><body>Texto</body></html>
<p align=left>Texto<p><p align=“left”>Texto<p>
![Page 7: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/7.jpg)
Reglas:
4. Los valores de los atributos no se contraen o comprimen:
5. Toda etiqueta debe de ser cerrarse:
Existen etiquetas vacías que son la excepción a esta regla, tales como "regla horizontal" y "salto de línea":
<p left>Texto<p><p align=“left”>Texto<p>
<html><body>Texto</body><html><body>Texto</body></html>
<hr> <br>
![Page 8: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/8.jpg)
HTML Browser
Esto es un párrafo.<p>Esto es un párrafo.</p>
![Page 9: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/9.jpg)
HTML Browser
Título 1Título 2Título 3Título 4Título 5Título 6
<h1>Título 1</h1><h2>Título 1</h2><h3>Título 1</h3><h4>Título 1</h4><h5>Título 1</h5><h6>Título 1</h6>
![Page 10: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/10.jpg)
HTML Browser
Texto normal, texto con cursiva.
<p>Texto normal, <em>texto con cursiva.</em></p>
![Page 11: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/11.jpg)
HTML Browser
Texto normal, texto en negritas.
<p>Texto normal, <strong>texto en negritas</strong></p>
![Page 12: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/12.jpg)
HTML Browser
Texto normal, texto subrayado.
<p>Texto normal, <ins>texto subrayado</ins></p>
![Page 13: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/13.jpg)
HTML Browser
Texto normal, texto tachado.
<p>Texto normal, <del>texto tachado</del></p>
![Page 14: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/14.jpg)
HTML Browser
TextoTexto en otra línea
Texto<br>Texto en otra línea
![Page 15: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/15.jpg)
HTML Browser
Texto normalTexto citado
<p>Texto normal</p><blockquote>Texto citado</blockquote>
![Page 16: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/16.jpg)
HTML Browser
HTML<abbr title=“HiperText MarkupLanguaje”>HTML</abbr>
![Page 17: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/17.jpg)
HTML Browser
Este texto contiene espacios en blanco que deben ser respetados.
<pre>Este texto contiene espacios en blanco que deben ser respetados.</pre>
![Page 18: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/18.jpg)
HTML Browser
if i=0 then j=1<code>if i=0 then j=1</code>
![Page 19: Programación Web I - ISC - UCQ - Presentación 04](https://reader036.fdocuments.co/reader036/viewer/2022062308/55be5c71bb61eba62d8b4772/html5/thumbnails/19.jpg)