curso de xhtml y css3
TRANSCRIPT
![Page 1: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/1.jpg)
CONCEPTOS GENERALESXHTML
Taller de XHTML y CSS3Nivel Basico - Parte I
Julian Fernandez Ortiz
Vicepresidente de IEEE Student Branch of GranadaGrado en Ingenierıa Electronica Industrial
Ruben Martın Moreno
Vocal en IEEE Student Branch of GranadaGrado en Estadıstica
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 2: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/2.jpg)
CONCEPTOS GENERALESXHTML
Licencia
Este documento esta realizadobajo licencia Creative Commons“Reconocimiento-CompartirIgual 3.0Espana” .
Fuente: Curso desarrollado por IEEE Student Branch of Granada
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 3: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/3.jpg)
CONCEPTOS GENERALESXHTML
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 4: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/4.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 5: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/5.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 6: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/6.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Estructura de Arbol
Existe una pagina principaldesde la que puedes llegara otras paginas de la web
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 7: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/7.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Estructura en Listas
Las paginas estanenlazadas con suscontiguas
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 8: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/8.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Estructura Mixta
Aprovecha las dosanteriores
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 9: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/9.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Estructura en Red
Paginas totalmenteinterconectadas
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 10: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/10.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 11: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/11.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 12: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/12.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 13: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/13.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 14: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/14.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 15: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/15.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 16: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/16.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
Se exige que se usen los elementos
DOCTYPEHEADBODYHTML
Se exige que se cierren todas las etiquetas
Se exige el uso de comillas en torno a valores de atributos
Todos los elementos deben estar en minuscula
Todos los valores han de indicarse de forma explıcita
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 17: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/17.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
W3C
https://validator.w3.org/#validate_{}by_{}input
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 18: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/18.jpg)
CONCEPTOS GENERALESXHTML
Estructura de un Sitio WebLos Estandares Web - W3C
W3C
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 19: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/19.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 20: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/20.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 21: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/21.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Definicion del Documento
Declaracion DOCTYPE<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Etiqueta HTML
<html xmlns="http://www.w3.org/1999/xhtml">
...
</html>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 22: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/22.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 23: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/23.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 24: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/24.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 25: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/25.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 26: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/26.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 27: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/27.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 28: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/28.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
Incluye:
Tıtulo de la pagina
Informacion importante para losmotores de busqueda(Etiquetas)
Ubicacion
Hojas de estilos (CSS)
Scripts
<head>
<title>CURSO XHTML Y CSS</title>
</head>
IMPORTANTE
La declaracion de un tıtulo para lapagina es OBLIGATORIA
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 29: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/29.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
METADATOS mas usuales<meta charset="UTF-8">
<meta name="description" content="CURSO XHTML Y CSS">
<meta name="keywords" content="HTML,CSS,XML,XHTML">
<meta name="author" content="Julian Fernandez; Ruben Martın">
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 30: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/30.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cabecera
<head>
<title>CURSO XHTML Y CSS</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Language" content="Espa~nol" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script><!--SCRIPT--></script>
</head>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 31: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/31.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Cuerpo
Contenido de la web
Se incluye el texto, imagenes yvıdeos que queremos que semuestren en la web
<body>
<!--Contenido de tu Pagina-->
</body>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 32: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/32.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
En Resumen...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><!--Tıtulo en la Pesta~na de Busqueda--></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Language" content="Espa~nol" />
<link href="../style/style.css" rel="stylesheet" type="text/css" />
<!--SCRIPTS-->
</head>
<body>
<!--Contenido de tu Pagina-->
</body>
</html>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 33: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/33.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
En Resumen...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><!--Tıtulo en la Pesta~na de Busqueda--></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Language" content="Espa~nol" />
<link href="../style/style.css" rel="stylesheet" type="text/css" />
<!--SCRIPTS-->
</head>
<body>
<!--Contenido de tu Pagina-->
</body>
</html>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 34: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/34.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
En Resumen...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><!--Tıtulo en la Pesta~na de Busqueda--></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Language" content="Espa~nol" />
<link href="../style/style.css" rel="stylesheet" type="text/css" />
<!--SCRIPTS-->
</head>
<body>
<!--Contenido de tu Pagina-->
</body>
</html>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 35: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/35.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
En Resumen...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><!--Tıtulo en la Pesta~na de Busqueda--></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Language" content="Espa~nol" />
<link href="../style/style.css" rel="stylesheet" type="text/css" />
<!--SCRIPTS-->
</head>
<body>
<!--Contenido de tu Pagina-->
</body>
</html>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 36: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/36.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 37: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/37.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Tipos de etiquetas mas utilizadas (e imprescindibles)
Encabezados
Parrafo
Tipologıa de letra
Script
Codigo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 38: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/38.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Encabezados
Son jerarquicos entre sı
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>
RECUERDA
Cuanto mas pequeno es elnumero mas grande la letra
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 39: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/39.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Encabezados
Son jerarquicos entre sı
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>
RECUERDA
Cuanto mas pequeno es elnumero mas grande la letra
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 40: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/40.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
Todo el texto debe irencerrado en parrafos
<p>...</p>
RECUERDA
Es bueno separar cada parrafode manera independiente paraque sea mas facil el uso deidentificadores
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 41: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/41.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
Todo el texto debe irencerrado en parrafos
<p>...</p>
RECUERDA
Es bueno separar cada parrafode manera independiente paraque sea mas facil el uso deidentificadores
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 42: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/42.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 43: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/43.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 44: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/44.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 45: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/45.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 46: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/46.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 47: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/47.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 48: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/48.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 49: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/49.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 50: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/50.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
<abbr>...</abbr>
<b>...</b>
<i>...</i>
<em>...</em>
<u>...</u>
<s>...</s>
<sub>...</sub>
<sup>...</sup>
Abreviatura
Negrita
Cursiva
Enfatizado
Subrayado
Tachado
Subındice1
Superındice1
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 51: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/51.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Parrafos
Escribir codigo
<code>...</code>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 52: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/52.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 53: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/53.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Hipervınculos
Los enlaces nos permiten hacer relaciones internas (a secciones) oexternas (a otra web o contenido) en nuestra pagina
Estructura Basica
<a href="#">...</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 54: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/54.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Internas
Para crear nuestro punto dellegada deberemos aplicar
<a name="id">...</a>
al texto deseado
Y para el punto de partidaaplicamos
<a href="#id">...</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 55: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/55.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Internas
Para crear nuestro punto dellegada deberemos aplicar
<a name="id">...</a>
al texto deseado
Y para el punto de partidaaplicamos
<a href="#id">...</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 56: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/56.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas
Pueden ser locales o estar alojadas en internet
Enlazan otras webs o archivos
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 57: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/57.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas
Internet - WEB<a href="http://www.google.com">Google</a>
Internet - PDF<a href="http://www.ejemplo.com/informe.pdf">Ejemplo [PDF]</a>
Local - WORD<a href="/informe.doc">Ejemplo [DOC]</a>
Local - JPG (En Nueva Pestana)
<a href="../imagenes/fondo_escritorio.jpg" target="_blank">
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 58: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/58.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas
Internet - WEB<a href="http://www.google.com">Google</a>
Internet - PDF<a href="http://www.ejemplo.com/informe.pdf">Ejemplo [PDF]</a>
Local - WORD<a href="/informe.doc">Ejemplo [DOC]</a>
Local - JPG (En Nueva Pestana)
<a href="../imagenes/fondo_escritorio.jpg" target="_blank">
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 59: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/59.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas
Internet - WEB<a href="http://www.google.com">Google</a>
Internet - PDF<a href="http://www.ejemplo.com/informe.pdf">Ejemplo [PDF]</a>
Local - WORD<a href="/informe.doc">Ejemplo [DOC]</a>
Local - JPG (En Nueva Pestana)
<a href="../imagenes/fondo_escritorio.jpg" target="_blank">
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 60: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/60.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas
Internet - WEB<a href="http://www.google.com">Google</a>
Internet - PDF<a href="http://www.ejemplo.com/informe.pdf">Ejemplo [PDF]</a>
Local - WORD<a href="/informe.doc">Ejemplo [DOC]</a>
Local - JPG (En Nueva Pestana)
<a href="../imagenes/fondo_escritorio.jpg" target="_blank">
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 61: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/61.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas - emails
email en Nueva Pestana<a href="mailto:[email protected]" target="_blank">Envıanos un email</a>
email en Nueva Pestana + Asunto<a href="mailto:[email protected]?subject=ASUNTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Texto<a href="mailto:[email protected]?body=TEXTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Asunto + Texto<a href="mailto:[email protected]?subject=ASUNTO&body=TEXTO" target="_blank">
Envıanos un email</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 62: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/62.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas - emails
email en Nueva Pestana<a href="mailto:[email protected]" target="_blank">Envıanos un email</a>
email en Nueva Pestana + Asunto<a href="mailto:[email protected]?subject=ASUNTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Texto<a href="mailto:[email protected]?body=TEXTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Asunto + Texto<a href="mailto:[email protected]?subject=ASUNTO&body=TEXTO" target="_blank">
Envıanos un email</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 63: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/63.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas - emails
email en Nueva Pestana<a href="mailto:[email protected]" target="_blank">Envıanos un email</a>
email en Nueva Pestana + Asunto<a href="mailto:[email protected]?subject=ASUNTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Texto<a href="mailto:[email protected]?body=TEXTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Asunto + Texto<a href="mailto:[email protected]?subject=ASUNTO&body=TEXTO" target="_blank">
Envıanos un email</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 64: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/64.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Relaciones Externas - emails
email en Nueva Pestana<a href="mailto:[email protected]" target="_blank">Envıanos un email</a>
email en Nueva Pestana + Asunto<a href="mailto:[email protected]?subject=ASUNTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Texto<a href="mailto:[email protected]?body=TEXTO" target="_blank">
Envıanos un email</a>
email en Nueva Pestana + Asunto + Texto<a href="mailto:[email protected]?subject=ASUNTO&body=TEXTO" target="_blank">
Envıanos un email</a>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 65: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/65.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 66: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/66.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas
Existen 2 tipos
Ordenadas
Desordenadas
RECUERDA
Las listas se pueden anidar, ya sean del mismo o de distinto tipo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 67: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/67.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas
Existen 2 tipos
Ordenadas
Desordenadas
RECUERDA
Las listas se pueden anidar, ya sean del mismo o de distinto tipo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 68: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/68.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas Ordenadas
<ol>
<li>Padre
<ol>
<li>Hijo1</li>
<li>Hijo2</li>
<li>Hijo3
<ol>
<li>Nieto</li>
</ol></li>
</ol></li>
</ol>
1 Padre
1 Hijo12 Hijo23 Hijo3
1 Nieto
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 69: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/69.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas Ordenadas
<ol>
<li>Padre
<ol>
<li>Hijo1</li>
<li>Hijo2</li>
<li>Hijo3
<ol>
<li>Nieto</li>
</ol></li>
</ol></li>
</ol>
1 Padre
1 Hijo12 Hijo23 Hijo3
1 Nieto
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 70: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/70.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas Desordenadas
<ul>
<li>Padre
<ul>
<li>Hijo1</li>
<li>Hijo2</li>
<li>Hijo3
<ul>
<li>Nieto</li>
</ul></li>
</ul></li>
</ul>
Padre
Hijo1Hijo2Hijo3
Nieto
RECUERDA
Los listas desordenadas son lasmas utilizadas a la hora de crearmenus
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 71: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/71.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas Desordenadas
<ul>
<li>Padre
<ul>
<li>Hijo1</li>
<li>Hijo2</li>
<li>Hijo3
<ul>
<li>Nieto</li>
</ul></li>
</ul></li>
</ul>
Padre
Hijo1Hijo2Hijo3
Nieto
RECUERDA
Los listas desordenadas son lasmas utilizadas a la hora de crearmenus
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 72: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/72.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Listas Desordenadas
<ul>
<li>Padre
<ul>
<li>Hijo1</li>
<li>Hijo2</li>
<li>Hijo3
<ul>
<li>Nieto</li>
</ul></li>
</ul></li>
</ul>
Padre
Hijo1Hijo2Hijo3
Nieto
RECUERDA
Los listas desordenadas son lasmas utilizadas a la hora de crearmenus
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 73: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/73.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Tablas
Etiquetas para construir una tabla
Obligatorias
<table>...</table>
<tr>...</tr>
<td>...</td>
Opcionales
<th>...</th>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 74: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/74.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Tablas
Etiquetas para construir una tabla
Obligatorias
<table>...</table>
<tr>...</tr>
<td>...</td>
Opcionales
<th>...</th>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 75: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/75.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Tablas
<table>
<tr>
<td><strong>XHTML</strong></td>
<td><strong>CSS</strong></td>
</tr>
<tr>
<td>Contenido</td>
<td>Forma</td>
</tr>
<tr>
<td>Texto</td>
<td>Formato</td>
</tr>
</table>
XHTML CSSContenido FormaTexto Formato
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 76: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/76.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Tablas
<table>
<tr>
<th>XHTML</th>
<th>CSS</th>
</tr>
<tr>
<td>Contenido</td>
<td>Forma</td>
</tr>
<tr>
<td>Texto</td>
<td>Formato</td>
</tr>
</table>
XHTML CSSContenido FormaTexto Formato
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 77: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/77.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Indice
1 CONCEPTOS GENERALESEstructura de un Sitio WebLos Estandares Web - W3C
2 XHTMLEstructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 78: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/78.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Etiquetas
Tipos de etiquetas para insertar contenido externo en la web
<img>...</img>
<audio>...</audio>
<video>...</video>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 79: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/79.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Etiquetas
Tipos de etiquetas para insertar contenido externo en la web
<img>...</img>
<audio>...</audio>
<video>...</video>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 80: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/80.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Etiquetas
Tipos de etiquetas para insertar contenido externo en la web
<img>...</img>
<audio>...</audio>
<video>...</video>
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 81: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/81.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 82: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/82.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 83: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/83.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 84: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/84.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 85: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/85.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 86: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/86.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Imagenes
Atributos utiles a la hora de insertar imagenes
src=“#”
Indica la URL para encontrar laimagen
name=“#”
Nombre de la imagen
alt=“#”
Pequena descripcion de la imagen
longdesc=“#”
Indica una URL donde encontraruna descripcion mas detallada dela imagen
height=“#”
Altura obligada de la imagen
width=“#”
Anchura obligada de la imagen
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 87: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/87.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 88: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/88.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 89: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/89.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 90: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/90.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 91: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/91.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 92: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/92.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Audios
Atributos utiles a la hora de insertar audio
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de audios: mp3,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir unavez que el audio se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elaudio antes de reproducirlo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause...
loop=“#”
Indica si una vez que termine lapista se debe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 93: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/93.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 94: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/94.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 95: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/95.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 96: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/96.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 97: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/97.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 98: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/98.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
Atributos utiles a la hora de insertar vıdeos
src=“#”
Indica la URL para encontrar elarchivo
type=“#”
Indica el tipo de vıdeo: mp4,mpeg, ogg...
autoplay=“#”
Indica si se debe reproducir elvıdeo se ha cargado(automaticamente)
preload=“#”
Especifica si se debe precargar elvıdeo
controls=“#”
Indica los controles que semuestran en pantalla: play,pause, mute...
loop=“#”
Indica si una vez que termine sedebe volver a reproducir
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 99: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/99.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
muted=“#”
Indica si el vıdeo debereproducirse sin audio por defecto
poster=“#”[URL]
Indica una imagen que mostrarhasta que el vıdeo se reproduzca
height=“#”
Altura obligada del vıdeo
width=“#”
Anchura obligada del vıdeo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 100: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/100.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
muted=“#”
Indica si el vıdeo debereproducirse sin audio por defecto
poster=“#”[URL]
Indica una imagen que mostrarhasta que el vıdeo se reproduzca
height=“#”
Altura obligada del vıdeo
width=“#”
Anchura obligada del vıdeo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 101: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/101.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
muted=“#”
Indica si el vıdeo debereproducirse sin audio por defecto
poster=“#”[URL]
Indica una imagen que mostrarhasta que el vıdeo se reproduzca
height=“#”
Altura obligada del vıdeo
width=“#”
Anchura obligada del vıdeo
Julian Fernandez, Ruben Martın XHTML y CSS
![Page 102: Curso de XHTML y CSS3](https://reader031.vdocuments.us/reader031/viewer/2022030217/588769071a28ab22358b502b/html5/thumbnails/102.jpg)
CONCEPTOS GENERALESXHTML
Estructura de la PaginaEtiquetasEnlacesListas y TablasMultimedia
Vıdeo
muted=“#”
Indica si el vıdeo debereproducirse sin audio por defecto
poster=“#”[URL]
Indica una imagen que mostrarhasta que el vıdeo se reproduzca
height=“#”
Altura obligada del vıdeo
width=“#”
Anchura obligada del vıdeo
Julian Fernandez, Ruben Martın XHTML y CSS