PDF de programación - html5 cheatsheet emezeta

CHEAT SHEET

DESARROLLO WEB

HTML5

Creado por @Manz ( http://twitter.com/Manz )

http://www.emezeta.com/

Sintaxis>2TJ+
Felemento>>atributo>8ñvalorñ0>contenido>FAelemento0

;tiquetas>de>texto

;tiquetas>de>agrupación

<em> texto>enfatizado
<strong> texto>importante
<mark>

texto>resaltado

<i>

<b>

<u>

vozAtono>alternativo
palabra>clave
anotaciones

<sub>
<small>

<super>

subíndice>A>superíndice

pequeñas>aclaraciones

<var>

variable>o>incógnita

<samp>

resultado>de>operación

<kbd>

<dfn>

title
<cite>

definición>A>abreviatura

entrada>de>usuario>htecladoá
<abbr>
significado
títulos>de>trabajos>u>obras

<q>

citas>hfrasesá

cite

UR+

enlace>de>referencia

<br>

<wbr>

salto>de>línea
oportunidad>de>salto>de>línea

<s>

texto>eliminado>hinexactoá

<ins>

<del>

texto>añadido>A>eliminado

cite

UR+ enlace>de>referencia

datetime

CechaAhora>h5SO6RIéá

<time> fecha>A>hora>hlegibleá

datetime

CechaAhora>h5SO6RIéá

<data> equivalencia>para>máquinas

value información>hpara>robotsá

<code> fragmento>de>código
<a>

<area> vínculos>y>área>de>enlaces

UR+ enlace>o>archivo

href
hreflang
download nombre>de>descarga
rel

5dioma>h5SOR.3úéá

alternate author bookmark help
next search prefetch

prev

license
nofollow

noreferrer

tag

target

_self

_blank

_parent destino

type

J5J;

formato>de>archivo

hsolo>para>Farea0á

texto>alternativo

alt
coords lista>de>coordenadas
shape

rectangle

circle

poly default

;tiquetas>de>scripting

<script>

ejecuta>o>carga>un>script

UR+ enlace>o>archivo
src
charset UTCú6 5SOú66U3úé 111
async carga>asíncrona
defer aplaza>ejecución
type J5J;

formato>de>archivo
<noscript> alternativa>sin>scripts
<template> carga>plantilla>2TJ+

capa>hfragmento>en>líneaá

<p> párrafo>de>texto
<div> capa>hdivisión>en>bloqueá
<span>
separación>temática
<hr>
<pre> texto>preformateado
<blockquote>

agrupación>de>cita
UR+ enlace>de>referencia

cite

;tiquetas>multimedia

<img> imagen

:PD PND SVD

W;BP

D5C

UR+ enlace>a>imagen

src
alt texto>alternativo>a>imagen
width

height

<iframe> marco>flotante>h2TJ+á

anchoAalto>de>imagen
2TJ+

UR+ enlace>a>página
src
name nombre>del>iframe
width
sandbox allowúforms allowúpointerúlock

anchoAalto>de>imagen

height

<figure> ilustración>hfiguraw>imagen111á
<figcaption> leyenda>de>ilustración
<main> contenido>principal
<map> mapa>de>imágenes>hFarea0á

name nombre>del>mapa

allowútopúnavigation

allowúsameúorigin

allowúpopups

allowúscripts
<embed> recurso>externo

SWC

src
type

UR+ enlace>a>recurso
J5J;

formato>de>archivo

;tiquetas>de>listas

lista>sin>orden
<ul>
<ol> lista>ordenada

start primer>número>de>la>lista
reversed lista>inversa
type

é a 4 i

tipo>numeración

5

<li> elemento>de>la>lista

value valor>del>elemento>hrobotsá

<dl> lista>de>definiciones
<dt>

<dd>

término>A>descripción

;tiquetas>de>tablas

<table>

tabla>de>datos>tabulados

border hfallback>para>U4>limitadosá
sortable permite>ordenar>columnas

fila>de>la>tabla>hrowá

<tr>
<th> cabecera>de>la>tabla>hheaderá
<td> datos>de>la>tabla>hdataá
<caption> leyenda>de>la>tabla
<thead> agrupación>de>cabecera
<tbody> agrupación>de>datos
<tfoot> agrupación>de>pie>de>tabla
<col>

<colgroup>

columna>A>agrupación

span aplicar>a>X>columnas

;tiquetas>de>sección

<article>

cuerpo>del>tema

<h2> ... <h6>

encabezados
<h1>
<section> sección>hgrupo>temáticoá
<nav> zona>de>navegación
<aside> contenido>no>relacionado
<header> cabecera>hlogow>título111á
<footer> pie>de>página
<address> información>de>contacto

5dioma>h5SOR.3úéá

es español en inglés

de alemán ...

CechaAhora>h5SO6RIéá

,IéUúI.ú.ITéy9.I9IOkIé9II

width

height

<object> recurso>externo

anchoAalto>de>imagen
SWC

UR+ enlace>a>recurso

data
name nombre>del>objeto
type J5J;
width

height

formato>de>archivo

anchoAalto>de>imagen

<param> parámetros>de>Fobject0

name nombre>del>parámetro
value

valor>del>parámetro

<video>

elemento>de>video
elemento>de>audio

JPy W;BJ ODV

JP. OPUS ODD

<audio>
para>Fvideo0>y>Faudio0

UR+ enlace>a>video

src
preload none metadata auto
mediagroup agrupación>multimedia
autoplay
loop modo>infinito>hbucleá
muted silencia>el>audio
controls muestra>controles

reproduce>al>inicio

solo>para>Fvideo0

poster
width

UR+ enlace>a>imagen>previa
anchoAalto>de>imagen
height

<source> formatos>alternativos
src UR+ enlace>a>videoAaudio
type J5J; -codecs8 GOV;G

<track> subtítulos

VTT

src UR+ enlace>a>subtítulo
lang
label

5dioma>h5SOR.3úéá
leyenda>del>subtítulo
subtitles captions descriptions

kind

chapters metadata

default subtítulo>primario

imágenes

<picture>
W;BP
<source> formatos>para>Fpicture0

:PD PND SVD

D5C

srcset UR+ lista>de>imágenes
sizes descriptor>de>ancho
media media>queries
type J5J;

formato>de>archivo

<canvas> lienzo>de>dibujo

width

height

anchoAalto>del>lienzo

CHEAT SHEET

DESARROLLO WEB

HTML5

Creado por @Manz ( http://twitter.com/Manz )

http://www.emezeta.com/

FormulariosUHTML

<form> formulario

name nombreUdelUformulario
métodoUHTTP
method get post
action URL enlaceUaUback9end
accept-charset UTF9A ISO9AA_V9( ...
autocomplete on off
novalidate noUrealizaUvalidaciones
_parent destino
target
enctype application.x9www9form9urlencoded

_blank

_self

multipart.form9data text.plain

<label> leyendaUparaUunUcampo

for asociaUconUidUdeUunUcampo

<input> campoUdeUentradaUdeUdatos

name nombreUdelUcampo

type text hidden search tel url email

FormulariosUHTML

<button> botón

name nombreUdelUcampo
type submit reset button
value valorUinicial

<keygen> generadorUdeUparUdeUclaves

name nombreUdelUcampo
keytype rsa
challenge cadenaUdeUdesafío

<output> resultados

name nombreUdelUcampo
for asociaUconUidUdeUunUcampo

<progress> barraUdeUprogreso

value progresoUactual
max valorUmáximo

<details> informaciónU-desplegable8

open despliegaUcontenido

<summary> información
<dialog> cuadroUdeUdiálogoUHTML

open despliegaUcontenido

EtiquetasUdeUdocumento

DRDOCTYPEUhtmlP documentoUHTML_
<html> contenidoUdelUdocumento
manifest URL archivoUdeUcaché

<head> cabeceraU-metadatos8
<body> contenidoUdeUlaUpágina

GtributosUglobales

id identificadorU-únicoUporUpágina8
class claseU-múltiplesUporUpágina8
lang

IdiomaU-ISOíCV9(8

yes no

palabraUtraducible

translate
title informaciónUalUpasarUelUratón
data-* metadatosUpersonalizados
style estilosUCSSUenUlínea
dir ltr

direcciónUdelUtexto

auto

rtl

EtiquetasUDheadPUyUmetadatos

<link> relaciónUconUotroUdocumento

rel tipoUdeUrelación

alternate versiónUalternativa
author informaciónUsobreUelUautor
license licenciaUdelUdocumento
help documentoUdeUayuda
icon iconoUdeUlaUURLU-favicon8
canonical URLUcanónica
prev
prefetch precargaUdeUpágina
search URLUdeUbúsquedaUweb
stylesheet URLUdeUestilosUCSS

next

páginaUanterior.siguiente

href URL enlaceUoUarchivo
hreflang
type MIME

IdiomaU-ISOíCV9(8

formatoUdeUarchivo

<meta> codificaciónUdelUdocumento

charset UTF9A ISO9AA_V9( 111

<meta> metadatosUdelUdocumento
author

name keywords description

application9name generator
content valorUdelUmetadato

<style> estilosUCSSUincrustados
media tipoUdeUmedioUaplicable
title nombreUdelUestiloUalternativo
type MIME

formatoUdeUarchivo
<base> baseUdeUURLsUrelativas

href URL enlaceUoUarchivo
target

_blank

_self

_parent destino

GtributosUcomunesUdeUformulario

true

false

teclaUdeUaccesoUrápido

accesskey
tabindex ordenUdelUcampoU-número8
spellcheck
form asociaUconUidUdeUunUformulario
autofocus colocaUfocoUenUcampo
hidden
contenteditable permiteUeditarUcampo

ocultaUunUcampo

revisaUortografía

number range color

password

file

datetime

date time

week month

checkbox radio

submit

image reset button

value valorUinicial
size tamañoUdelUcampo
list asociaUconUidUdeUDdatalistP
placeholder sugerenciaUvisual
accept formatosUsoportadosUo
alt
src

textoUalternativo
URL

enlaceUoUimagen

width

height

ancho.altoUdeUimagen

autocomplete on off
checked campoUseleccionado
multiple permiteUmúltiplesUvalores

<textarea> áreaUampliaUdeUtexto

name nombreUdelUcampo
autocomplete on off
cols númeroUdeUcolumnas
rows númeroUdeUfilas
placeholder sugerenciaUvisual
wrap

soft hard

mantieneUsaltos

<select> listaUdeUselección

name nombreUdelUcampo
size tamañoUdelUcampo
multiple selecciónUmúltiple

<datalist> listaU-modificable8
<option> elementoUdeUlista

value valorUinicial
label textoUvisible
selected opciónUseleccionada

<optgroup> agrupaciónUdeUopciones

label textoUvisible

<fieldset> agrupaciónUtemática

name nombreUdelUcampo

<legend> leyendaUparaUDfieldsetP

<meter> medidor

value progresoUactual
low umbralUinferior
high umbralUsuperior
optimum valorUóptimo

EsquemasUdeUDmeterP

MIME

LowUDUOptUDUHigh

LowUDUHighUDUOpt

OptUDULowUDUHigh

ValueUDULow

ValueUDULow

ValueUPULow

ValueUPUHigh

ValueUDUHigh

ValueUPUHigh

Otro

Otro

Otro

RestricciónUdeUcampos

camposUnuméricos

max

min
step cantidadUentreUsaltos

númeroUmínimo.máximo

camposUtextuales

minlength
pattern

maxlength longitudUmin.máx

REGEX

patrónUdeUvalidación

tipoUgeneral

required campoUobligatorio
disabled desactivadoU-noUseUenvía8
readonly impideUeditarUcampo

GtributosUqueUalteranUformulario

formmethod get post
formaction URL enlaceUaUback9end
formnovalidate noUrealizaUvalidaciones
formtarget
formenctype

multipart.form9data

_parent destino

_blank

_self

application.x9www9form9urlencoded

text.plain

DR99UcomentariosU99P