HTML
#html
Prepara tus exámenes
Prepara tus exámenes y mejora tus resultados gracias a la gran cantidad de recursos disponibles en Docsity
Consigue puntos base para descargar
Gana puntos ayudando a otros estudiantes o consíguelos activando un Plan Premium
Orientación Universidad
Prepara tus exámenes
Prepara tus exámenes y mejora tus resultados gracias a la gran cantidad de recursos disponibles en Docsity
Busca documentos
Prepara tus exámenes con los documentos que comparten otros estudiantes como tú en Docsity
Busca tu universidad
Encuentra los documentos específicos para los exámenes de tu universidad
Video Cursos
Estudia con lecciones y exámenes resueltos basados en los programas académicos de las mejores universidades
Quiz
Responde a preguntas de exámenes reales y pon a prueba tu preparación
Consigue puntos base para descargar
Gana puntos ayudando a otros estudiantes o consíguelos activando un Plan Premium
Comunidad
Pregúntale a la comunidad
Pide ayuda a la comunidad y resuelve tus dudas de estudio
Ebooks gratuitos
¡Nuestros e-books salva-estudiantes!
Descarga nuestras guías gratuitas sobre técnicas de estudio, métodos para controlar la ansiedad y consejos para la tesis preparadas por los tutores de Docsity
Este documento proporciona una introducción a la diferencia entre elementos y etiquetas html, así como ejemplos de cómo usar elementos como video, audio, table, footer, y etiquetas como <video>, <audio>, <table>, <footer>, </html>, </body>. También se explican conceptos como la perspectiva del elemento, el uso de role en elementos no semánticos, y la diferencia entre elementos vacíos y elementos con contenido. Además, se cubren temas relacionados como formularios, caché html5, marcado de código informático, tablas y metadatos. En general, este documento ofrece una visión general de conceptos fundamentales de html que pueden ser útiles para estudiantes universitarios, desarrolladores web y aprendices de programación.
Tipo: Guías, Proyectos, Investigaciones
2021/2022
1 / 177
Esta página no es visible en la vista previa
¡No te pierdas las partes importantes!
Documentos relacionados
Vista previa parcial del texto
¡Descarga Elementos y etiquetas HTML y más Guías, Proyectos, Investigaciones en PDF de Diseño solo en Docsity!
HTML
#html
Tabla de contenido
- Acerca de
- Capítulo 1: Empezando con HTML
- Observaciones
- Versiones
- Examples
- Hola Mundo
- Introducción
- Perspectiva del elemento
- Creando una página simple
- Desglose de página simple
- Capítulo 2: Anclas e hipervínculos
- Introducción
- Sintaxis
- Parámetros
- Examples
- Enlace a otro sitio
- Abrir enlace en una nueva pestaña / ventana
- Enlace a un ancla
- Enlace que ejecuta JavaScript
- Enlace a una página en el mismo sitio
- Enlace que ejecuta el cliente de correo electrónico.
- Enlace que marca un número.
- Capítulo 3: ARIA
- Sintaxis
- Observaciones
- Examples
- role = "alerta"
- role = "alertdialog"
- role = "application"
- role = "artículo"
- role = "banner"
- role = "button"
- role = "cell"
- role = "checkbox"
- role = "columnheader"
- role = "combobox"
- role = "complementario"
- role = "contentinfo"
- role = "definición"
- role = "dialog"
- role = "directorio"
- role = "documento"
- role = "form"
- role = "grid"
- role = "gridcell"
- role = "grupo"
- role = "encabezado"
- role = "img"
- role = "link"
- role = "list"
- role = "listbox"
- role = "listitem"
- role = "log"
- role = "main"
- role = "marquee"
- role = "math"
- role = "menu"
- role = "menubar"
- role = "menuitem"
- role = "menuitemcheckbox"
- role = "menuitemradio"
- role = "navegación"
- role = "note" - role = "option" - role = "presentación" - role = "barra de progreso" - role = "radio" - role = "region" - role = "radiogroup" - role = "row" - role = "rowgroup" - role = "rowheader" - role = "scrollbar" - role = "search" - role = "searchbox" - role = "separator" - role = "control deslizante" - role = "spinbutton" - role = "status" - role = "switch" - role = "tab" - role = "table" - role = "tablist" - role = "tabpanel" - role = "cuadro de texto" - role = "timer" - role = "toolbar" - role = "tooltip" - role = "árbol" - role = "treegrid" - role = "treeitem"
- Capítulo 4: Atributos de datos
- Sintaxis
- Parámetros
- Examples
- Uso de atributos de datos
- Soporte de navegadores antiguos
- Capítulo 5: Atributos de evento HTML
- Examples
- Eventos de formulario HTML
- Eventos del teclado
- Examples
- Capítulo 6: Atributos globales
- Parámetros
- Observaciones
- Examples
- Atributo contenteditable
- Capítulo 7: Barras de navegación
- Examples
- Barra de navegación básica
- Barra de navegación HTML5
- Examples
- Capítulo 8: Clases e identificaciones
- Introducción
- Sintaxis
- Parámetros
- Observaciones
- Examples
- Dar un elemento a una clase
- Usando clases en CSS
- Dando a un elemento una identificación
- Problemas relacionados con identificaciones duplicadas
- Valores aceptables
- Para una identificación
- Para una clase
- Nota importante: cómo los valores de ID y clase se tratan fuera de HTML
- Referencias W3C
- Capítulo 9: Comentarios
- Introducción
- Sintaxis
- Observaciones
- Examples
- Creando comentarios
- Comentarios condicionales para Internet Explorer
- Bajo nivel oculto
- Nivel bajo revelado
- Comentando espacios en blanco entre elementos en línea
- Capítulo 10: Controles del menú de selección
- Sintaxis
- Examples
- Seleccione el menú
- Cambiando el tamaño
- Menús de selección multi-opciones
- Grupos opcionales
- Opciones
- Seleccionando una opción por defecto
- Lista de datos
- Soporte del navegador
- Capítulo 11: Cotizaciones de marcado
- Observaciones
- Examples
- En línea con
- Comillas
- URL de origen (atributo de cite )
- Bloque con
- URL de origen (atributo de cite )
- Citación / Atribución
- Capítulo 12: Doctypes
- Introducción
- Sintaxis
- Observaciones
- Examples
- Añadiendo el Doctype
- HTML 4.01 Doctypes
- HTML 4.01 estricto
- HTML 4.01 Transicional
- HTML 4.01 conjunto de marcos
- HTML 5 Doctype
- Insensibilidad de casos
- Doctypes antiguos
- HTML 3.2
- HTML 2.0
- Capítulo 13: Elemento de etiqueta
- Sintaxis
- Parámetros
- Examples
- Uso básico
- Sobre la etiqueta
- Capítulo 14: Elemento de progreso
- Parámetros
- Observaciones
- Examples
- Progreso
- Cambiando el color de una barra de progreso.
- Chrome / Safari / Opera
- Firefox
- explorador de Internet
- HTML Fallback
- Capítulo 15: Elemento de salida
- Parámetros
- Examples
- Elemento de salida usando para y atributos de formulario
- Elemento de salida con atributos
- Capítulo 16: Elemento div
- Introducción
- Sintaxis
- Examples
- Anidamiento
- Uso básico
- Capítulo 17: Elementos de control de entrada
- Introducción
- Sintaxis
- Parámetros
- Observaciones
- Examples
- Casilla de verificación y botones de radio
- Visión general
- Atributos
- value
- checked
- Accesibilidad
- Etiquetas
- Grupos de botones
- Oculto
- Contraseña
- Enviar
- Expediente
- Validación de entrada
- Necesario
- Longitud mínima / máxima
- Especificando un rango
- Emparejar un patrón
- Aceptar tipo de archivo
- Reiniciar
- Número
- Tel
- Botón
- Atributos
- [name]
- [type]
- [value]
- Atributos extra para botones de envío
- Color
- Url
- Fecha
- DateTime-Local
- Imagen
- Distancia
- Mes
- Hora
- Semana
- Texto
- Buscar
- DateTime (Global)
- Capítulo 18: Elementos de los medios
- Parámetros
- Observaciones
- Soporte en los navegadores.
- Examples
- Utilizando
yElementopara mostrar contenido de audio / video - Audio
- Vídeo
- Encabezado de video o fondo
- Utilizando
- Capítulo 19: Elementos de seccionamiento
- Observaciones
- Examples
- Elemento del artículo
- Evitar el uso innecesario
- Elemento principal
- Elemento de navegación
- Artículos en línea
- Use los elementos de la lista cuando sea necesario
- Evitar el uso innecesario
- Elemento de sección
- Elemento de encabezado
- Ejemplos:
- Elemento de pie de página
- Capítulo 20: Elementos vacíos
- Introducción
- Observaciones
- Examples
- Elementos vacios
- Capítulo 21: Empotrar
- Parámetros
- Examples
- Uso básico
- Definiendo el tipo MIME
- Capítulo 22: Encabezados
- Introducción
- Sintaxis
- Observaciones
- Examples
- Usando encabezados
- La estructura correcta importa
- Capítulo 23: Entidades de carácter
- Examples
- Caracteres especiales comunes
- Entidades de personajes en HTML
- Examples
- Capítulo 24: Formas
- Introducción
- Sintaxis
- Parámetros
- Observaciones
- Examples
- Sumisión
- El atributo de acción
- El atributo del método
- Mas atributos
- Atributo de destino en la etiqueta de formulario
- Cargando archivos
- Agrupando algunos campos de entrada
- Capítulo 25: Formato de texto
- Introducción
- Sintaxis
- Examples
- Negrita, cursiva y subrayado
- Texto en negrita
- Texto en cursiva
- Texto subrayado
- Destacando
- Insertado, Borrado o Enojado
- Superíndice y subíndice
- Abreviatura
- Capítulo 26: HTML 5 Caché
- Observaciones
- Examples
- Ejemplo básico de caché de HTML
- Capítulo 27: Idiomas de contenido
- Sintaxis
- Observaciones
- Accesibilidad
- Examples
- Lenguaje de elementos
- Elementos con múltiples idiomas
- Manejo de atributos con diferentes idiomas
- Idioma base del documento
- URL regionales
- Capítulo 28: IFrames
- Parámetros
- Observaciones
- Política del mismo origen
- atributo de sandbox
- Examples
- Fundamentos de un marco en línea
- Configuración del tamaño del marco
- Usando Anclas Con IFrames
- Usando el atributo "srcdoc"
- Caja de arena
- Capítulo 29: Imágenes
- Sintaxis
- Parámetros
- Examples
- Creando una imagen
- Ancho y altura de la imagen
- Elegir texto alternativo
- Notas al pie
- Imagen sensible utilizando el atributo srcset
- Usando srcset con tamaños
- Usando srcset sin tallas
- Imagen sensible utilizando un elemento de imagen.
- Capítulo 30: Incluir código JavaScript en HTML
- Sintaxis
- Parámetros
- Observaciones
- Examples
- Enlace a un archivo JavaScript externo
- Incluyendo directamente el código JavaScript
- Incluyendo un archivo JavaScript ejecutándose de forma asíncrona.
- Manejo de Javascript deshabilitado
- Capítulo 31: Liza
- Introducción
- Sintaxis
- Observaciones
- Examples
- Lista desordenada
- Lista ordenada
- Cambiando manualmente los números.
- Cambiando el tipo de numeral
- Descripción de la lista
- Listas anidadas
- Capítulo 32: Lona
- Parámetros
- Observaciones
- Examples
- Ejemplo básico
- Dibujando dos rectángulos en una
- Capítulo 33: Mapas de imagen
- Sintaxis
- Parámetros
- Observaciones
- Examples
- Introducción a los mapas de imagen
- Descripción
- Ejemplo básico
- Capítulo 34: Marcando código informático
- Sintaxis
- Observaciones
- Elementos relacionados
- Examples
- En línea con
- Bloque con y
- Capítulo 35: Mesas
- Introducción
- Sintaxis
- Observaciones
- Examples
- Mesa simple
- Abarcando columnas o filas
- Tabla con thead, tbody, tfoot y subtítulo
- Grupos de columnas
- Ámbito de aplicación
- Capítulo 36: Meta informacion
- Introducción
- Sintaxis
- Observaciones
- Examples
- Codificación de caracteres
- Actualización automática
- Control de diseño móvil
- Información de la página
- application-name
- author
- description
- generator
- keywords
- Los robots
- Reconocimiento de números de teléfono
- Medios de comunicación social
- Facebook / Open Graph
- Facebook / Artículos instantáneos
- Gorjeo
- Google+ / Schema.org
- Redireccionamiento automatico
- Aplicación Web
- Capítulo 37: Párrafos
- Introducción
- Parámetros
- Examples
- Párrafos HTML
- Capítulo 38: Recursos de enlace
- Introducción
- Sintaxis
- Parámetros
- Examples
- Hoja de estilo CSS externa
- JavaScript
- Sincrónico
- Asincrónico
- Diferido
- Favicon
- CSS alternativo
- Alimentación web
- Enlace del atributo 'media'
- Anterior y Siguiente
- Sugerencia de recursos: dns-prefetch, prefetch, prerender
- Preconectarse
- DNS-Prefetch
- Prefetch
- Prerender
- Capítulo 39: SVG
- Introducción
- Observaciones
- Examples
- Incrustar archivos SVG externos en HTML
- Usando el elemento de imagen
- Usando el elemento objeto
- SVG en línea
- Incrustar SVG usando CSS
- Capítulo 40: Tabindex
- Parámetros
- Observaciones
- Examples
- Agregar un elemento al orden de tabulación
- Eliminar un elemento del orden de tabulación
- Definir un orden de tabulación personalizado (no recomendado)
- Capítulo 41: Usando HTML con CSS
- Introducción
- Sintaxis
- Examples
- Uso externo de la hoja de estilo
- Hoja de estilo interna
- Estilo en linea
- Múltiples hojas de estilo
- Creditos
Acerca de
You can share this PDF with anyone you feel could benefit from it, downloaded the latest version
from: html
It is an unofficial and free HTML ebook created for educational purposes. All the content is
extracted from Stack Overflow Documentation, which is written by many hardworking individuals at
Stack Overflow. It is neither affiliated with Stack Overflow nor official HTML.
The content is released under Creative Commons BY-SA, and the list of contributors to each
chapter are provided in the credits section at the end of this book. Images may be copyright of
their respective owners unless otherwise specified. All trademarks and registered trademarks are
the property of their respective company owners.
Use the content presented in this book at your own risk; it is not guaranteed to be correct nor
accurate, please send your feedback and corrections to [email protected]
https://riptutorial.com/es/home 1
lenguaje de marcado. Las etiquetas HTML proporcionan significado semántico y legibilidad de
la máquina para el contenido de la página.
Un elemento generalmente consiste en una etiqueta de apertura ( ), una etiqueta
de cierre ( ), que contiene el nombre del elemento rodeado de corchetes
angulares, y el contenido entre: ...content...
Hay algunos elementos HTML que no tienen una etiqueta de cierre o ningún contenido. Estos se
llaman elementos vacíos. Los elementos vacíos incluyen , , y .
Los nombres de los elementos pueden considerarse palabras clave descriptivas para el contenido
que contienen, como video , audio , table , footer.
Una página HTML puede consistir en cientos de elementos que luego se leen en un navegador
web, se interpretan y se convierten en contenido legible o audible en la pantalla.
Para este documento es importante tener en cuenta la diferencia entre elementos y etiquetas:
Elementos: video , audio , table , footer
Etiquetas: , , , , ,
Perspectiva del elemento
Vamos a romper una etiqueta ...
La etiqueta
representa un párrafo común.
Los elementos comúnmente tienen una etiqueta de apertura y una etiqueta de cierre. La etiqueta
de apertura contiene el nombre del elemento entre paréntesis angulares (
). La etiqueta de
cierre es idéntica a la etiqueta de apertura con la adición de una barra diagonal ( / ) entre el
soporte de apertura y el nombre del elemento ( ).
El contenido puede ir entre estas dos etiquetas:
This is a simple paragraph.
.Creando una página simple
El siguiente ejemplo de HTML crea una página web simple "Hello World".
Los archivos HTML se pueden crear utilizando cualquier editor de texto. Los archivos se deben
guardar con una extensión .html o .htm [2]^ para que se reconozcan como archivos HTML.
https://riptutorial.com/es/home 3
Una vez creado, este archivo se puede abrir en cualquier navegador web.
Hello!
Hello World!
This is a simple paragraph.