Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (19)
Destacado
Destacado (18)
Similar a HTML-Etiquetas
Similar a HTML-Etiquetas (20)
Último
Último (15)
HTML-Etiquetas
- 1. FPE DiseñadorWeb y Multimedia Módulo 1. Teoría. Planificar y entender.Módulo 2. HTML. El esqueleto de la web.
- 2. EL HTML Definición: HTML: HyperText Markup Language (Lenguaje de Marcado de Hipertexto), es el lenguaje de marcado predominante para la elaboración de páginas web. Usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes
- 3. EL HTML Un poco de historia En 1991 Tim Berners-Lee hace la primera descripción de HTML, en un documento llamado HTML Tags (Etiquetas HTML). Describía 22 elementos que comprendían el diseño inicial y relativamente simple de HTML. Trece de estos elementos todavía existen en HTML 4
- 4. EL HTML Estructura básica del código: Etiquetas <--> Elementos. Formado por Etiquetas, atributo y contenido. <p align=“center”> Esto es un párrafo </p> atributo variable Elemento Etiqueta Inicio Etiqueta Cierre Contenido
- 5. EL HTML Estructura básica del código: <p align=“center”> Esto es un párrafo </p> atributo variable • Cada elemento está contenido entre la etiqueta de inicio y cierre. • El atributo de un elemento se especifica en la etiqueta de inicio. • La mayoría de los atributos de un elemento son pares nombre-valor, separados por un signo de igual «=» Elemento Etiqueta Inicio Etiqueta Cierre Contenido
- 6. EL HTML Tipos de marcado o etiquetado Presentacional o de formato Estructural Hipertextual
- 7. EL HTML Tipos de marcado Presentacional o de formato: El marcado presentacional describe la apariencia del texto, sin importar su función. Por ejemplo, <b>negrita</b> indica que los navegadores web visuales deben mostrar el texto en negrita. La mayoría del marcado presentacional ha sido desechada con HTML 4.0, en favor de hojas de estilo en cascada.
- 8. EL HTML Tipos de marcado Estructural: El marcado estructural describe el propósito del texto. El marcado estructural no define cómo se verá el elemento, pero la mayoría de los navegadores web han estandarizado el formato de los elementos. (Ver ejemplo)
- 9. EL HTML Tipos de marcado Hipertextual: El marcado hipertextual se utiliza para enlazar partes del documento con: Otros sitios Otras páginas Partes de la misma página
- 10. EL HTML Partes esenciales del documento HTML -HTML define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML. <html></html> - Head define la cabecera del documento HTML; contiene información sobre el documento que no se muestra directamente al usuario. <head></head> -Body define el contenido principal o cuerpo del documento. Esta es la parte del documento html que se muestra en el navegador<body></body>
- 11. EL HTML Así se ve el código <html > <head> <title>Un Ejemplo</title> </head> <body> <p>Esta es una página web con <strong>negritas</strong>, con <em>cursivas</em>, combinando <em><strong>negritas y cursivas</strong></em>.</p> <blockquote> <p>Con un párrafo más abajo y con la sangría aumentada.<br /> Así cómo un salto de línea </p></blockquote> </body> </html> Así se ve la web
- 12. EL HTML Etiquetas del <Head> <title>: define el título de la página. Aparece en la ventana del navegador y en la barra de título encima de la ventana. <link>: para vincular el sitio a hojas de estilo o iconos. <style>: para colocar el estilo interno de la página usando CSS, u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un archivo externo usando la etiqueta <link>. <meta>: para metadatos como la autoría, la descripción de la página y las palabras claves para buscadores.
- 13. EL HTML Etiquetas de Formato: <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>). <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>). <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>). <u>: texto subrayado.
- 14. EL HTML Tabla de Acentos:
- 15. EL HTML Etiquetas HTML: <h1> a <h6>: encabezados o títulos del documento con diferente relevancia. Atributo etiquetas <h1> a <h6> align Valores: center centrado left izquierda right derecha <h1 align="center">Nombre de la web</h1>
- 16. EL HTML Etiquetas HTML: <p>: etiqueta para párrafo. Atributo etiquetas <p> align Valores: center centrado left izquierda right derecha <p align="center">Texto de la web</p>
- 17. EL HTML Etiquetas HTML: <ul><li>: etiquetas para listas. <blockquote>: etiqueta para citas. Aumenta el margen izquierdo y derecho en 40 píxeles aproximadamente.
- 18. EL HTML Etiquetas HTML: <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src=“mifoto.jpg" height=“100” width=“80” alt=“Foto Alumno”> Atributos: align alt border hspace vspace
- 19. EL HTML Etiquetas HTML: <font>: determina el tipo de letra en que se mostrará en contenido. <font face=“Times, Arial, san-serif” size=“3”>Es es el texto</font> Atributos: face (nombre o familia como: serif, san-serife) size point-size color
- 20. EL HTML Etiquetas HTML: <a>: hipervínculo o enlace. Atributo href Tipo de enlaces: Internos: Absolutos Relativos Externos Anclas: <a href=“#nombre-seccion”> (enlace apunta al ancla) <a name=“nombre-seccion”> (ancla a la que apunta)
- 21. EL HTML Etiquetas HTML: <a>: hipervínculo o enlace. Atributos: title: información extra target: _blank _parent _self _top framename
- 22. EL HTML Etiquetas HTML: <a>: hipervínculo o enlace. Estado de los enlaces: No visitado unvisited Activo active Visitado visited
- 23. EL HTML Etiquetas HTML: <body>: especifica características de la página como el fondo, ancho, apariencia de los enlaces. Atributos del fondo: bgcolor: color de fondo background: imagen de fondo bgproperties: lo mantiene fijo al hacer scroll. Valor: fixed Atributos de márgenes: topmargin rightmargin bottommargin leftmargin marginwidth marginheight
- 24. EL HTML Etiquetas HTML: <body>: especifica características de la página como el fondo, ancho, apariencia de los enlaces. Atributos de color de los enlaces: link: enlaces no visitados. alink: enlaces activos. vlink: enlaces visitados. Otros atributos: text: color del texto.
- 25. EL HTML Etiquetas HTML: <br/>: salto de linea <hr /> linea horizontal
- 26. EL HTML Etiquetas HTML: <table>: define una tabla. <tr>: fila de una tabla. <td>: celda de una tabla (debe estar dentro de una fila).
- 27. EL HTML Etiquetas HTML: <table> Atributos de tamaño y disposición: align width height vspace hspace cellpadding cellspacing
- 28. EL HTML Etiquetas HTML: <table> Atributos de color y apariencia: border background bgcolor bordercolordark bordercolorlight
- 29. EL HTML Etiquetas HTML: <tr> Atributos: align background bgcolor bordercolor bordercolorlight bordercolordark height valign width
- 30. EL HTML Etiquetas HTML: <td> Atributos: align background bgcolor bordercolor bordercolorlight bordercolordark height valign width nowrap colspan rowspan
- 31. EL HTML Etiquetas HTML: Los comentarios. Las “chuletas” del código <!-- TEXTO DEL COMENTARIO --> Ejemplo: <!-- Aquí empiezan los RSS del Blog -->