Etiquetas HTML

Estructura
<title></title
<!DOCTYPE html> <html></html> <head></head> <meta>
>
Codig
Etiquetas Para cargar

Etiquetas para Para dar titulos, van desde Etiquetas para Para dar orden o para imágenes en
parrafos el h1 al h6 y parrafos listas secuencia en listas
imágenes la web
enlace de la
<img
<h1></h1> primer titulo <ol></ol> listas ordenadas src="ruta/im imagen del
pc u otro sitio
agen">
web
nombre de la
<h2></h2> segundo titulo <ul></ul> listas sin ordenar alt
imagen
númerador que va title nombre de la

<h3></h3> tercer titulo <li></li>
dentro de ol o ul imagen
Etiqueta padre
ancho de la
<h4></h4> cuarto titulo <dl></dl> para listas de width
imagen
definiciones
da el titulo a la
alto de la
<h5></h5> quinto titulo <dt></dt> definición, va heigth
imagen
dentro de <dl>
contenido de la
definición, va Solo se un width o heigth a
<h6></h6> sexto titulo <dd></dd>
dentro de <dl> y la vez
<dt>
<p></p> separación de parrafo

<br> Saltos de línea
<strong></str
letra en negrita
ong>
<em></em> letra en cursiva
Caracteres especiales
Nombre de la type input para

Caracter Código de la Entidad password
Entidad contraseñas
á à á crea cajas de validación

é é é
í í í <input type="checkbox"
ó ó ó checkbox id="terminos" value="yes">
<label for="terminos">Acepto
ú ú ú los términos y
< < < condiciones</label>
> > >
@ @ Selección única en radio
& & & <input type="radio" id="manana"
value="M" name="horario">
$ $ <label
Radio
€ € € for="manana">Mañana</label>
<input type="radio" id="tarde"
" " " value="T" name="horario">
Π Π Π <label for="tarde">
Estructura base del HTML
<body></bod
y>
Codigos HTML
Etiquetas captura de datos captura de datos y

para crear crear columnas y etiquetas para y enunciados de etiquetas para enunciados de
celdas para tablas formularios formularios
tablas formulario formulario
etiqueta que debe

etiqueta principal
<table></tab contener las otras <form></form> para indicar que month type input para
le> etiquetas para meses
hay un formulario
tablas
envuelve todo el
construir filas de las <fieldset></field contenido del type input para
<tr></tr> number
tablas set> formulario en un números
margen
construir columnas
<legend></legen le da el titulo a los range (min="" y type input para
<th></th> de las tablas y
d> formularios max="") rango de números
negrita
atributo de la
etiqueta form
construir columnas autocomplete para type input para
<td></td> search
de las tablas autocompletar busquedas
campos ya
diligenciados
atributo de la
etiqueta semantica
<thead></th y encabezado de etiqueta form type input para
name tel
ead> para dar nombre teléfono
tabla
al formulario
etiqueta para
<tbody></tb etiqueta semantica <input type=""> definir que tipo type input para
url
ody> y de cuerpo de tabla de dato de va a ingresar URL´s
capturar
<tfoot></tfo etiqueta semantica color type input para type input para
week
ot> y pie de la tabla eligir colores ingresar semanas
atributo que van
dentro de la type input para
type input pata
border="" etiqueta date reset restablecer el
definir fechas
<table>para definir formulario
un borde a la tabla
atributo que va type input para

dentro de th o td, type input para enviar la
colspan="" datetime submit
sirve para combinar fecha y hora información
columnas diligenciada
atributo que va
dentro de th o td, type inputpara atributo input
rowspan="" datetime-local disabled
sirve para combinar fecha y hora local desabilita campos
filas
atributo input para

type input para
file readonly crear cuadros de
cargar archivos
solo lectura
Las etiquetas th o td van dentro de
las etiquetas tr y estas a su vez van
dentro de la etiqueta table
atributo input para
type input para
email correos maxlenth establecer número
maximo de letras
electronicos
que deja ingresar
Otras etiquetas - captura de datos
type input para Listas con grupos dentro de la lista Listas donde se puede elegir va
contraseñas opciones
crea cajas de validación
<label for="ciudades">Cuidad</label> <label for="tipo">Tipo</label><

<input type="checkbox" <select name="ciudades">
="terminos" value="yes"> <optgroup label="Latinoamerica"> <select name="tipo"
bel for="terminos">Acepto <option multiple="true">
los términos y value="caracas">Caracas</option> Lista selección <option
Lista con grupos <option value="musico">Músico</opti
condiciones</label> multiple
value="bogota">Bogotá</option> <option
</optgroup><optgroup
label="Europa"> value="pintor">Pintor</optio
Selección única en radio <option <option
put type="radio" id="manana" value="madrid">Madrid</option> value="actor">Actor</option
value="M" name="horario"> <option <option
<label value="londres">Londres</option>
</optgroup> value="escultor">Escultor</opti
r="manana">Mañana</label> </select>
nput type="radio" id="tarde" </select>
value="T" name="horario">
<label for="tarde">
atributo input
para fijar maximo
max y min o minimo de
valores
ingresados
atributo input
para fijar un valor
value predeterminado
o dar nombre a
submit
atributo input
para fijar un
step incremente o
decremento
según valor
atributo input
para dar pista
placeholder
sobre el dato a
diligenciar
Atributo input
name para diferenciar
un campo de otro
Atributo general
que sirve para
id dar una
identificación
unica al codigo
<select></select crea una lista

> desplegable
se ingresa el
<option></optio campo que va
n> dentro de la lista
desplegable
Crea áreas de
<textarea=""</t texto para
extarea> ingresar
comentarios
atributo textarea
name para nombrar la
caja
definen el ancho
rows y cols y algo del área de
texto
Se usa para
nombrar un input
<label
que debe
for=""></label>
asociarse con su
id
Atributo input
requeried para campos
obligatorios
onde se puede elegir varias

opciones
or="tipo">Tipo</label><br>
<select name="tipo"
multiple="true">
<option
musico">Músico</option>
<option
"pintor">Pintor</option>
<option
="actor">Actor</option>
<option
escultor">Escultor</option>
</select>
Redirige a páginas internas
Etiquetas para enlaces Etiquetas semánticas
o externas
Nombre de carpeta /
<a
nombre archivo o ruta <header></header>
href="ruta/página"></a>
absoluta de la web
Atributo etiqueta <a> para

target="_blank" evitar que el sitio web <nav></nav>
remplace nuestro
contenido
Se usa como ancla dentro la

misma página, se debe
<a href="#contenido"></a> poner el atributo id en un <section></section>
titulo para poder
referenciarlo
<a Se usa para utilizar

imágenes como enlaces a
href="ruta/página"><img
src="ruta/imagen" otras páginas, recordar usar <article></article>
los atributo width o heigth
alt="nombre
para cambiar tamaño de
title="nombre"</a> imagen.
<a
href="mailto:ejemplo@eje Se usa para redirigir un
mplo.com? enlace para enviar un <aside></aside>
subject=nombreasunto">n correo
ombre enlace</a>
atributo etiqueta <a> para

download="ruta/archivo" descargar archivos, se debe <footer></footer>
dirigir poner la ruta
<main></main>
<sumary></sumary>
<details> <summary>Luis Torres</summary>

<p>Escritor</p> <p>más información</p></details>
<time></time>
<mark></mark>
Codigos html
se usan para organizar mejor la estructura de cógigo y

Etiquetas semánticas
renderizado
Encabezado del
documento, aquí se situa el <abbr> Para abreviaciones
logo de la página principal
sección que contiene todos

los elementos de
navegación a páginas
<b> En negrita
internas o externas
Agrupar contenido de un
mismo tema en general
<blockquote> Referencia de un texto
Es usado para representar

cualquier contenido,
mensaje de usuaio,
<cite> Cita
publicaciones, etc.
Usado para crar un

submenu de navegación
lateral que puede servir
para tener enlaces a otros
<del> Texto eliminado (tachado)
recursos que nos propios
de la pagina o app web
Pie de página, donde se

pone la información de
contacto, creaditos, <em> Énfasis
creadores, dirección o
derechos reservados
es el cuerpo del contenido
por debajo de header y <ins> Texto insertado
encima de footer
se utiliza para mostrat un

extracto de la información
que al darle click se <meter> Medida
expande dentro del
contenido de <details>
<q>
summary>Luis Torres</summary>
p> <p>más información</p></details> Cita corta
<small>
se utiliza para indicar
tiempo o fechas
<strong> Texto importante
sirve para resaltar una

palabra o frase
<sub> Subíndice
<sup> Supraíndice
Sirven como contenedores
Son etiquetas especiales
genericos dentro de la
que usan cuando queremos Etiquetas de
Etiquetas de código diagramación de página y
representar algún código diagramación
facilitan dar el estilo usando
especial
CSS
se emplea para representar

un código fuente usando
representa agrupa un
un tipo y tamaño de letra,
bloque de código HTML e
<code> para proporcionar un <div>
inserta saltos de línea antes
formato adecuado a una
y después su contenido.
pieza de programa de
computación.
se usa para que todos los

(espacios, saltos,
<pre> tabulaciones) que estén <span> agrupa una porción de una
línea de código HTML.
dentro de ella sean
interpretados literalmente.
se usa para que todos los

(espacios, saltos,
<var> tabulaciones) que estén <span> resaltaria una frase o palabra, <div> resaltaria
toda una línea
dentro de ella sean
interpretados literalmente.
<samp> se usa para definir la salida

de un programa.
define una combinación de

<kbd>
teclas.
es usada para colocar

<template> código HTML y no
interpretar las etiquetas.
Códigos html
<figure> se usa para
encerrar imágenes . Tablas,
<figure></figure> y <audio
código entre otros, se usa
<figcaption> src="ruta/audio"></audio>
junto con <figcaption> para
darle in titulo al contenido
controls
autoplay
<figure>
<img src="https://free-
images.com/sm/cede/lion_
head_male_lion.jpg"
Ejemplo loop
alt="León">
<figcaption>Imagen
1.1: León</figcaption>
</figure>
preload
este atributo viene con dos valores "none" para no

almacenar los archivos y "auto" para almacenas los
archivos temporalmente
<video
src="ruta/video"></video>
Posee los mismos atributos de audio más 3 adicionales
poster
width="10px"
heigth="10px"
<source src="ruta/video">
type
<source> también se puede usar con <audio>

Códigos html
se usa para incrustar una

Se usa para agregar
<iframe página web externa dentro
contenido de audio a la
src="ruta/iframe"></iframe> de un marco en nuestra
web
página web
atributo de audio para atributos de iframe para

establecer una barra de width y heigth definir el ancho y alto del
reproducción mismo
atributo de audio para

reproducir atributo iframe para darle
name
automaticamente el audio un nombre al mismo
al cargar la página
atributo audio para

se aconseja agragar un texto en caso de que el iframe no
reproducir el audio en bucle
se pueda cargar
infinito
atributo audio para

almacenar en una memoria
atributo iframe para
externa el contenido
agregar seguridad a la
cuando ya se ha cargado sandbox
página que estemos
almenos una vez, esto con
el fin de cargar más insertando en la nuestra
rapidamente la página web
valores de sandbox
viene con dos valores "none" para no
archivos y "auto" para almacenas los permite que los datos
archivos temporalmente allow-forms diligenciados en el
formulario se envien
Se usa para agregar permite que el sitio web
contenido de video en la allow-scripts alojado ejecute codigos
web javascript
se usa para que el sitio

alojado pueda proponer
os atributos de audio más 3 adicionales allow-top-navigation
otros contenido diferentes
al nuestro
se usar para poner una

activa la opción de pantalla
imagen en caso de que el
allow-full-scream completa si el sitio lo
navegador no sea capas de
permite
mostrar el video
tamaño de ancho del video

tamaño de alto del video
se usa para dar más
opciones de reproducción
de video según el formato
atributo de <source> para

especificar el formato de
video se usa así:
video/formato.video
ambién se puede usar con <audio>
se usa para crear gráficos
vectoriales o insertar
<svg></svg> imágenes svg externas, son
imágenes que no pierden
resolución en web
Para insertar imágenes svg

Las imágenes svg se pueden
se puede usar la etiqueta
crear con illustrator u otro
tradicional <img> con los
programa en linea o
atributos y valores
vectorial
normales

Etiquetas HTML

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Etiquetas HTML

Cargado por

Copyright:

Formatos disponibles

Estructura

Etiquetas Para cargar

númerador que va title nombre de la

<p></p> separación de parrafo

<em></em> letra en cursiva

Nombre de la type input para

á &#224; &aacute; crea cajas de validación

Etiquetas captura de datos captura de datos y

etiqueta que debe

atributo que va type input para

atributo input para

Otras etiquetas - captura de datos

crea cajas de validación

<label for="ciudades">Cuidad</label> <label for="tipo">Tipo</label><

<select></select crea una lista

onde se puede elegir varias

Atributo etiqueta <a> para

Se usa como ancla dentro la

<a Se usa para utilizar

atributo etiqueta <a> para

<details> <summary>Luis Torres</summary>

se usan para organizar mejor la estructura de cógigo y

sección que contiene todos

Es usado para representar

Usado para crar un

Pie de página, donde se

se utiliza para mostrat un

sirve para resaltar una

se emplea para representar

se usa para que todos los

se usa para que todos los

<samp> se usa para definir la salida

define una combinación de

es usada para colocar

este atributo viene con dos valores "none" para no

Posee los mismos atributos de audio más 3 adicionales

<source> también se puede usar con <audio>

se usa para incrustar una

atributo de audio para atributos de iframe para

atributo de audio para

atributo audio para

atributo audio para

se usa para que el sitio

se usar para poner una

tamaño de ancho del video

atributo de <source> para

Para insertar imágenes svg

También podría gustarte

á à á crea cajas de validación