HTML basico Flashcards
Crear documento HTML5 básico
!DOCTYPE html html head /head body /body /html
Poner título x a un documento
title x /title
Indicar idioma base x para atributos y texto
html lang=”x”
“es” para español
“en” para ingles
r12a.github.io/app-subtags
Indicar juego de caracteres x
meta charset=”x”
“utf-8” como charset estandar
Indicar diseño adaptable
meta name=”viewport” content=”width=device-width; initial-scale=1.0”
Dar significado semántico x con propiedad y a un contenido z, orientado a cliente
n itemscope itemtype="http://www.schemas.org/x" -> m itemprop="y" -> -> z -> /m /n
Dar una clase semantica x orientada a estilo a un contenido y
n class=”x”
/n
Poner un encabezado de tamaño x para un contenido y
hx y /hx
x esta entre 1 y 6
Poner descripción x a un documento
meta name=”description” content=”x”
Poner un párrafo con contenido x
p x /p
Crear contenedores de cabecera, menú de navegación, contenido principal con secciones, artículos, figuras, títulos de figuras, panel lateral y pie de página
header /header nav /nav main section article figure /figure figcaption /figcaption /article /section /main aside /aside footer /footer
Destacar un contenido x
strong x /strong
Enfatizar un contenido x
em x /em
Hacer salto de línea
br /
Poner un enlace a una página web externa x
a href=”x” y /a
x es una url
Poner un enlace a una zona interna y de una página web externa x
a href=”x#y” z /a
x es una url, y es un id de esa url
Poner un enlace a una página interna x
a href=”#x” y /a
n id=”x”
x es un id interno
Poner una lista no ordenada con x elementos
ul li x1 /li li x2 /li (...) /ul
Poner una lista ordenada con x elementos
ol li x1 /li li x2 /li (...) /ol
Poner una lista descriptiva con x elementos e y descripciones
dl -> dt x1 /dt -> dd y1 /dd -> dt x2 /dt -> dd y2 /dd -> (...) /dl
Crear tabla con x filas e y columnas
table tr td x1y1 /td td x1y2 /td (...) /tr (...) /table
Hacer que celda de una tabla ocupe x columnas
td colspan=”x”
/td
Hacer que celda de una tabla ocupe x filas
td rowspan=”x”
/td
Agrupar filas de cabecera, de cuerpo, y de pie, en una tabla
thead (...) /thead tbody (...) /tbody tfoot (...) /tfoot
Poner una celda de cabecera de contenido x en una tabla
th x /th
Poner título x a una tabla
caption x /caption
Definir x grupos de columnas que ocupan y columnas en una tabla
colgroup col span="y1" / col span="y2" / (...) /colgroup
Enlazar un documento a una hoja de estilos x
link rel=”stylesheet” href=”x” /
x es una ruta interna a la hoja de documentos
Poner una imagen x con texto alternativo y
img src=”x” alt=”y” /
x es una ruta o url
Poner un ancho y alto x y a una imagen
img src=”” alt=”” height=”x” width=”y” /
Poner una lista ordenada con x elementos, y valor inicial, z tipo de numeración y en orden inverso
ol start="y" type="z" reversed li x1 /li li x2 /li (...) /ol
z puede ser 1, a, A, i, I
Enlazar una descripción x a una imagen
img src=”” alt=”” longdesc=”x” /
x es una ruta o url
Enviar a servidor coordenadas de clic en una imagen
img src=”” alt=”” ismap /
Enlazar un mapa de imagen x a una imagen
img src=”” alt=”” usemap=”#x” /
map name=”x”
area /
/map
Crear un mapa de imagen con área rectangular, coordenadas x y, enlace z al clicar y texto alternativo w
map name=””
area shape=”rect” coords=”x1,y1,x2,y2” href=”z” alt=”w” /
/map
x y empiezan desde esquina arriba izquierda
z es una ruta o url
Crear un mapa de imagen con área circular, centro x y, radio r, enlace z al clicar y texto alternativo w
map name=””
area shape=”circle” coords=”x,y,r” href=”z” alt=”w” /
/map
x y empiezan desde esquina arriba izquierda
z es una ruta o url
Crear un mapa de imagen con área poligonal, coordenadas x y, enlace z al clicar y texto alternativo w
map name=””
area shape=”poly” coords=”x1,y1,(…)” href=”z” alt=”w” /
/map
x y empiezan desde esquina arriba izquierda
z es una ruta o url
Dar una id semantica x orientada a estilo a un elemento y
y id=”x”
/y
x debe ser unico en todo el documento
Indicar sentido de escritura x del texto
html dir=”x”
x es ltr, rtl o auto
Poner script x a un documento
head
script x /script
/head
Poner un texto x en negrita, un texto y en italica, un texto z subrayado
b x /b
i y /i
u z /u
Poner un texto x superindice, un texto y subindice
sup x /sup
sub y /sub
Visualizar paginas webs x, y, z en la misma pagina en tres columnas diferentes de tamaños 30%, 20%, resto, respectivamente
frameset cols="30%, 20%, *" frame src="x" / frame src="y" / frame src="z" / /frameset
Poner un texto x como cita
q x /q