0% encontró este documento útil (0 votos)
3 vistas7 páginas

Estructura y Etiquetas de HTML

El documento proporciona una guía sobre la sintaxis y uso de etiquetas HTML, incluyendo atributos y valores para cada etiqueta. Se describen etiquetas clave como `<head>`, `<body>`, y varias etiquetas de contenido como `<h1>`, `<p>`, `<a>`, y `<form>`, junto con sus atributos correspondientes. Además, se explican las funciones de metadatos y estilos en la cabecera del documento.

Cargado por

Samuel Polo
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
3 vistas7 páginas

Estructura y Etiquetas de HTML

El documento proporciona una guía sobre la sintaxis y uso de etiquetas HTML, incluyendo atributos y valores para cada etiqueta. Se describen etiquetas clave como `<head>`, `<body>`, y varias etiquetas de contenido como `<h1>`, `<p>`, `<a>`, y `<form>`, junto con sus atributos correspondientes. Además, se explican las funciones de metadatos y estilos en la cabecera del documento.

Cargado por

Samuel Polo
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

#Comienzo del archivo

<!DOCTYPE html> (tipo documento HTML)

La sintaxis de aquellas etiquetas que tienen atributos y valores es de la forma:

<etiqueta atributo1=”valor1” atributo2=”valor2” atributo3=”valor3”>…</etiqueta>

### Lista de Etiquetas HTML

#### Cabecera (`<head>`) Contiene información del cabecero como son el título
del navegador,meta información sobre el lenguaje,vínculos y enlaces,y diseño de
estilos y dinámicas interactivas de JavaScript.

Sintaxis: <head> …</head>

1. **`<meta>`(etiqueta meta información que añade información relevante al


documento como descripción del contenido del navegador,buscador palabras
clave, descrifado natural de lenguaje…)

- **Atributos (propiedades de la etiqueta)

- `name (Atributo que indica el nombre de la información a exportar) :

Valores comunes:

Description: Valor que indica contenido relevante del documento.

Keywords: valor que indica Palabras clave para ser localizado por el buscador web.

Author: Nombre de autor de la página web.

Viewport: Diseño responsable para dispositivos móviles.

- `content`(Atributo que indica el texto descriptivo del metadato)

- `http-equiv (Atributo que indica la acción del protocolo de transferencia de


comunicación en la web equivalente)

Valores comunes:

Refresh:Valor que indica la acción de actuliazarse automáticamente la página web


en una fecha y hora concreta.

Expires: Valor que indica la acción de exploración del contenido web en una fecha
y hora concreta.
Set Cookie: Valor que indica el conjunto de permisos de información requeridos
para la visualización de la pagina web.

X-UA-Compatible:Valor que permite la visualización compatible en las diferentes


versiones de internet explore.

-Content (Atributo que indica el contenido del metadato)

- `charset`(Atributo que permite leer el lenguaje de un conjunto de caracteres)

: Valor UTF-8: Valor que refleja el Lenguaje universal

2. **`<title>`**

- **Atributos:**

- Ninguno.

- **Valores:** Texto del título.

3. **`<link>`**

- **Atributos:**

- `rel`: (stylesheet, icon, preload).

- `href`: URL del recurso.

- `type`: (text/css, image/x-icon).

4. **`<style>`**

- **Atributos:**

- `type`: (text/css).

- `media`: (screen, print, all).

- **Valores:** Código CSS en línea.

5. **`<script>`**

- **Atributos:**

- `src`: URL del archivo JavaScript.


- `type`: (text/javascript, module).

- `async`: Sin valor (se ejecuta sin bloquear).

- `defer`: Sin valor (se ejecuta después del documento).

- **Valores:** Código JavaScript en línea o URL.

6. **`<base>`**

- **Atributos:**

- `href`: URL base para todas las URL relativas.

- `target`: (_self, _blank, _parent, _top).

- **Valores:** URL.

#### Cuerpo (`<body>`)

7. **`<h1>` a `<h6>`**

- **Atributos:**

- `id`: Texto único.

- `class`: Texto para clases.

- **Valores:** Texto para títulos (h1, h2, …, h6).

8. **`<p>`**

- **Atributos:**

- `id`: Texto único.

- `class`: Texto para clases.

- `style`: Texto CSS en línea.

- **Valores:** Texto del párrafo.

9. **`<a>`**

- **Atributos:**
- `href`: URL del enlace.

- `target`: (_blank, _self, _parent, _top).

- `title`: Texto de tooltip.

- **Valores:** Texto del enlace.

10. **`<img>`**

- **Atributos:**

- `src`: URL de la imagen.

- `alt`: Texto alternativo.

- `width`: n° (píxeles).

- `height`: n° (píxeles).

- **Valores:** URL y texto.

11. **`<ul>`, `<ol>`, `<li>`**

- **Atributos:**

- `<ul>`: `type` (square, circle, disc) – no estándar en HTML5.

- `<ol>`: `type` (1, A, a, I, i).

- `<li>`: `value`: número inicial (en `<ol>`).

- **Valores:** Elementos de lista.

12. **`<table>`**

- **Atributos:**

- `border`: n° (para el borde).

- `cellpadding`: n° (espacio interno).

- `cellspacing`: n° (espacio externo).

- **Valores:** Tabla, celdas.

13. **`<tr>`, `<td>`, `<th>`**


- **Atributos:**

- `colspan`: n° (cuántas columnas combina).

- `rowspan`: n° (cuántas filas combina).

- `align`: (left, center, right) – no estándar en HTML5.

- `valign`: (top, middle, bottom) – no estándar en HTML5.

- **Valores:** Filas y celdas de la tabla.

14. **`<form>`**

- **Atributos:**

- `action`: URL para envío.

- `method`: (GET, POST).

- `enctype`: (application/x-www-form-urlencoded, multipart/form-data).

- **Valores:** Formulario.

15. **`<input>`**

- **Atributos:**

- `type`: (text, password, email, number, checkbox, radio, submit, file, etc.).

- `name`: Nombre del campo.

- `value`: Valor por defecto.

- `placeholder`: Texto de ejemplo.

- `required`: Sin valor (uso booleano).

- **Valores:** Campo de entrada.

16. **`<button>`**

- **Atributos:**

- `type`: (button, submit, reset).

- `name`: Nombre del botón.

- `value`: Valor del botón.


- **Valores:** Texto del botón.

17. **`<textarea>`**

- **Atributos:**

- `rows`: n° (número de filas).

- `cols`: n° (número de columnas).

- `placeholder`: Texto de ejemplo.

- `maxlength`: n° (máximo de caracteres).

- **Valores:** Texto de área de texto.

18. **`<div>` y `<span>`**

- **Atributos (comunes):**

- `id`: Texto único.

- `class`: Texto para clases.

- `style`: Texto CSS en línea.

- **Valores:** Elementos contenedores.

19. **`<video>`**

- **Atributos:**

- `src`: URL del vídeo.

- `controls`: Sin valor (uso booleano).

- `autoplay`: Sin valor (uso booleano).

- `loop`: Sin valor (uso booleano).

- `muted`: Sin valor (uso booleano).

- **Valores:** Vídeo.

20. **`<audio>`**

- **Atributos:**
- `src`: URL del audio.

- `controls`: Sin valor (uso booleano).

- `autoplay`: Sin valor (uso booleano).

- `loop`: Sin valor (uso booleano).

- `muted`: Sin valor (uso booleano).

- **Valores:** Audio.

También podría gustarte