Referencia HTML.cdr

Transcripción

Referencia HTML.cdr
PLANETALIA
Formación y Consultoría
Referencia HTML
Nota : Únicamente se indican elementos no obsoletos y que forman parte de la especificación strict o transitional de HTML
Estructura Básica
Elementos Fundamentales
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Declaración de
documento HTML
Tag (marca) de inicio
<html>
<head>
Tag (marca) de cierre
<title> ... </title>
Elemento "title"
</head>
<body>
<!-- Inicio -->
<p>
<em>
<b>
<sub>
<div>
<h1>
<h3>
<h5>
<pre>
<style>
Contenido del elemento "title"
Comentario.Puede abarcar varas líneas
Atributos. El orden no importa
Mundo! <br/>
<br/> = <br></br>
Entidad. Comienzan con & y acaban con ; .
Representan caracteres especiales. En este caso, ¡
cellspacing
cellpadding
Planetalia
Titulo1
Titulo2
Titulo3
A
B
C
D
E
F
www.planetalia.com
colspan='3'
radio
button
submit
checkbox
reset
Tamaño en pantalla
Tamaño máximo de los datos
Campo de solo lectura
Campo deshabilitado
Nombre del campo
Valor inicial
Campo marcado (solo checkbox y radio)
Si size=1 y no está el atributo
<select size = "6"
múltiple,se genera un combo
multiple="multiple" >
<optgroup label="España">
<option value="MAD" selected="selected">Madrid</option>
<option value="SOR">Soria</option>
<option value="VAL">Valencia</option>
</optgroup>
<optgroup label="Francia">
<option value="PAR">Paris</option>
<option value="LYN">Lyon</option>
</optgroup
</select>
<button type="...">
<img src="ok.gif"/>
Aceptar
</button>
submit
reset
button
<fieldset>
<legend>Titulo</legend>
</fieldset>
Imagen
URL de la imagen
Texto alternativo
Mapa de imagen de servidor
Mapa de imagen con nombre nombre
JavaScript
<script src="...">
..
</script>
Código fuente JavaScript externo
CSS
<link rel="stylesheet"
href="..."
type="text/css" />
Hoja de estilos externa
Vínculo
Vínculos y Recursos Externos
<img src="..."
alt="..."
ismap="ismap"
usemap="#nombre" />
<a href="..."
title="..."
target="...">
Recurso a abrir
Título del vínculo
Marco en el que abrir el recurso.
Listas
<ol type="..." start="5">
<li>Elemento 1</li>
<li>Elemento 2</li>
</ol>
5. Elemento 1
6. Elemento 2
<ul type="..." >
<li>Elemento 1</li>
<li>Elemento 2</li>
</ul>
Elemento 1
Elemento 2
1 1,2,3,4...
i i,ii,iii,iv,v
I I,II,III,IV, V
a a,b,c,d,e
A A,B,C,D,E
disc
square
circle
Mapas de Imagen de Cliente
_blank = nueva ventana _top = marco raíz
<a name="..." />
hidden
<textarea rows="5" cols="60">
Plantilla HTML
de Planetalia
</textarea>
filas del pie
filas del cuerpo
file
Formulario
grupos de opciones
filas de título encabez.
<table border'1' cellspacing='2' cellpadding='3' >
<caption>
Planetalia
</caption>
<thead>
<tr>
<th>Titulo1</th>
<th>Titulo2</th>
<th>Titulo3</th>
</tr>
</thead>
<tbody>
<tr>
<td> A </td>
<td> B </td>
<td> C </td>
</tr>
<tr>
<td> D </td>
<td> E </td>
<td> F </td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan='3'>
www.planetalia.com
</td>
</tr>
</tfoot>
</table>
text
password
<input type="..."
size="20"
maxlength="100"
readonly="readonly"
disabled="disabled"
name="empresa"
value="Planetalia"
checked="checked"/>
Tablas
Salto de línea
Resaltado
Cursiva
Superíndice (ax2)
Capa de caracteres
Encabezado de nivel 2
Encabezado de nivel 4
Encabezado de nivel 6
Cita
Código JavaScript
Formularios
Nombre del atributo
Valor del atributo. Delimitado con " o '
&iexcl;Hola
<br/>
<strong>
<i>
<sup>
<span>
<h2>
<h4>
<h6>
<blockquote>
<script>
<form action="..." method="GET|POST">
<p class="texto" id="p1">
</p>
</body>
</html>
Párrafo
Énfasis
Negrita
Subíndice (H2O)
Capa de bloque
Encabezado de nivel 1
Encabezado de nivel 3
Encabezado de nivel 5
Texto preformateado
Estilos CSS
Etiqueta una posición del documento
actual. Puede referenciarse con #nombre
<map name="...">
<area shape="...."
coords="..."
href="..."
alt="..."
title="..."/>
<area ... />
</map>
circle
x,y,r
rect
poly
x1,y1,x2,y2
x1,y1
x1,y1,x2,y2,x3,y3,...
r
x,y
Creado por Alexander Hristov. (c) 2008 Planetalia S.L. (http://www.planetalia.com), Licencia Creative Commons by-nc-nd 2.5.
Texto completo de la licencia en http://creativecommons.org/licenses/by-nc-nd/2.5/es/
La última versión se encuentra siempre en http://www.ahristov.com/tutoriales/trucos-javascript/referencia-visual-html.html
x2,y2

Documentos relacionados