Vous êtes sur la page 1sur 3

La

Sbana

del

HTML
Inicio /fin del documento HTML Inicio/Fin de la cabecera Ttulo del documento Descripcin del contenido del documento Lista de palabras claves para bsqueda Carga documento transcurrido un tiempo Ubicacin de los ficheros de la pgina Documentos relacionados (ej: hoja estilo) Sonido de fondo Inserta un script Inicio del cuerpo Define prrafo | salto de lnea Alineacin de elementos genricos Texto cabecera|preformateado|indentado Negrita|cursiva|subrayado|tachado Grande|pequeo| super/sub-ndice Resaltado | enfatizado| definicin |cita | Terminal | parpadeo | Define fuente del texto Fuente base. Listas no numeradas Listas ordenadas Listas de definiciones Inserta lnea horizontal Inserta imgenes Define un mapa Define un enlace de tipo texto Define un enlace de tipo imagen Define un identificador de enlace Inserta tabla Amplia definicin de filas de una tabla Amplia definicin de celdas de cabecera Amplia definicin de celdas Entrada bsica de datos Entrada bsica de datos Entrada caja de password Entrada por casillas Entrada por Botones Entrada oculta Entrada caja de texto mltiples lneas Entrada por lista de seleccin Botn de envo de datos Botn grfico de envo de datos Botn de borrado Final del cuerpo Define frames Define instrucciones si no hay frames Ampla definicin de frames Caracteres especiales Caracteres especiales... Colores | <!-- Comentarios -->

<HTML></HTML> <HEAD> <TITLE>TtuloDocumento</TITLE> <META name=description content=DescripcinDocumento> <META name=keywords content=ListaDePalabrasClaves> <META http-equiv=refresh content=Segundos; url=URL> <BASE href=URL> <LINK rel= TipoRelacion type=TipoMIME href=URL> <BGSOUND src= Ficheroloop= > <SCRIPT language=LenguajeScript> [<!--] Instrucciones [-->] </SCRIPT> | <NOSCRIPT>HTMLAlternativo</NOSCRIPT> </HEAD> <BODY background=URL-ImagenFondo bgcolor=ColFondo text=ColTexto link=ColEnlace vlink=ColEnlaceVisitado alink=ColEnlClick> <P align=AlineacinHorizontal:Left|Right|Center|Justify>TextoPrrafo</P> | <BR> <DIV align=AlineacinHorizontal:Left|Right|Center|Justify> </DIV> <H1..6>TextoCabecera</H1..6> | <PRE>TextoPreformateado</PRE> | <BLOCKQUOTE>TextoIndentadoIzquierdaDerecha</BLOCKQUOTE> <B>TextoNegrita</B> | <I>TextoCursiva</I> | <U>TextoSubrayado</U> | <S>TextoTachado</S> | <STRIKE>TextoTachado</STRIKE> <BIG>Textogrande</BIG><SMALL>Textopequeo</SMALL>|<SUP>TextoSuperndice</SUP> | <SUB>TextoSubndice</SUB> <STRONG>TextoNegrita</STRONG>| <EM>TextoEnfatizado</EM> |<DFN>Definicion</DFN> | <CITE>TextoCursiva</CITE> | <TT>TextoTerminal</TT> | <BLINK>TextoParpadeo</BLINK> | <FONT size=Tamao:1..7|(+/-)Nmero color=ColorTexto face=NombreFuente></FONT> <BASEFONT size=Tamao:1..7|(+/-)Nmero color=ColorTexto face=NombreFuente></FONT> <UL type=TipoVieta:disk|circle|square><LH>TtuloLista</LH><LI>Elemento1<LI>Elemento2<LI>Elementon</UL> <OL start=InicioLista type=TipoOrdenacin:1|A|a|I|i><LH>TtuloLista</LH><LI>Elemento1<LI>Elemento2<LI>Elementon</OL> <DL><LH>TtuloLista</LH><DT>Elemento1<DD>Definicin1<DT>Elementon<DD>Definicinn</DL> <HR color=ColLnea align=Alineacin:Left|Right|Center noshade size=GrosorLneaPixels width=AnchoLnea:%Ventana|NmPixels> <IMG src=URL alt=Texto align=Top|middle|bottom|left|rigth border=Tamao height=Alt width=Anc hspace=MarHor vspace=MarVer> <MAP name=NomMapa><AREA shape=rect|circle|polygon coords=Coord1 href=URL ></MAP><IMG src=URL-Imagen usemap=NomMapa> <A href=URL-DocumentoHTML[#IdentificadorEnlace] target=NombreFrame|_top|_self|_blank>TextoDescriptivoEnlace</A> <A href=URL-DocumentoHTML[#IdentificadorEnlace] target=NombreFrame|_top|_self|_blank><IMG src=URL-ArchivoImagen></A> <A name=IdentificadorEnlace>TextoDescriptivo</A> <TABLE border=T cellpadding=S cellspacing=S width=P|% height=P|% bgcolor=C> <TR><TH>Cab</TH><TD>Celda</TD></TR></TABLE> <TR align=AlineacinHorizontal:left|right|center valign=AlineacinVertical:top|middle|bottom bgcolor=ColorFondo></TR> <TH aligh=AliHor:left|right|center|justify valign=AliVer:top|middle|bottom bgcolor=Color width=Ancho rowspan=ExpFil colspan=EC>Cab</TH> <TD aligh=AliHor:left|right|center|justify valign=AliVer:top|middle|bottom bgcolor=Color width=Ancho rowspan=ExpFil colspan=EC>Cel</TD> <FORM action=mailto:direccin@correo|URL-CGI method=post|get enctype=TEXT/PLAIN target=Frame>ElementosFormulario</FORM> <INPUT type=text|password|checkbox|radio|hidden|submit|image|reset name=NombreVariable value=ValorInicial> <INPUT type=text name=NombreVariable value=ValorInicial size=LongitudVentanaEntrada maxlength=LongitudMximaCaracteres> <INPUT type=password name=NombreVariable value=ValorInicial size=LongitudVentanaEntrada maxlength=LongitudMximaCaracteres> <INPUT type=checkbox name=NombreVariable [value=ValorAsociado] [checked]> <INPUT type=radio name=NombreVariable [value=ValorAsociado] [checked]> <INPUT type=hidden name=NombreVariable value=ValorInicial> <TEXTAREA name=NombreVariable rows=Filas cols=Columnas>ValorInicial</TEXTAREA> <SELECT name=NomVar multiple size=Ln><OPTION selected value=Val1>PrimeraOpcin<OPTION value=Val2>SegundaOpcin</SELECT> <INPUT type=submit value=MensajeBotn> <INPUT type=image src=URL-Imagen name=NombreVariable> <INPUT type=reset value=MensajeBotn> </BODY> <FRAMESET rows=P1|%1,Pn|%n cols=P1|%1,Pn|%n><FRAME src=URL1 name=Nom1><FRAME src=URLn name=NOMn></FRAMESET> <NOFRAMES>HTMLAlternativo</NOFRAMES> <FRAME src=URL name=NombreFrame marginwidth=MarIzqDer marginheight=MarSupInf scrolling=BarraDesplazam:yes|no|auto noresize> &nbsp;(esp) &aacute;() &eacute;() &iacute;() &oacute;() &uacute;() &uuml;() &Uuml;() &ntilde;() &Ntilde;() &lt;(<) &gt;(>) &amp;(&) &quot;() &copy;(C) &reg;(R) &#191;() &#161;() #FFFFFF (Bla) #000000 (Neg) #FF0000 (Roj) #00FF00 (Ver) #0000FF (Azul) #FFFF00 (Ama) #C0C0C0 (Gri) #00FFFF (Cel) #FFCC00 (Nar)

CSS
Propiedades- Bloques
margin-top, margin-right, margin-bottom, margin-left, margin: top right bottom left padding-top, padding-right, padding-bottom, paddingleft, padding: top right bottom left border-top-width, border-right-width, border-bottomwidth, border-left-width, border-width: top right bottom left border-style border-color width, height float clear

Descripcin
Distancia mnima entre un bloque y los dems elementos. Tanto margin como margins() se utilizan para cambiar todos estos atributos a la vez. Distancia entre el borde y el contenido de un bloque. Anchura del borde de un bloque. Estilo del borde de un bloque. Color del borde de un bloque. Tamao de un bloque. Su mayor utilidad est en su aplicacin a un elemento grfico. Justificacin del contenido de un bloque. Permiso para que otro elemento se pueda colocar a su izquierda o derecha.

Posibles valores
auto | pt, in, cm, mm | em, ex, px, % Por defecto es cero. pt, in, cm, mm | em, ex, px, %. Por defecto es cero. none | thin | medium | thick | pt, in, cm, mm | em, ex, px none | dotted | dashed | solid | double | groove | ridge | inset | outset nombre-color | #RRGGBB | rgb(rrr, ggg, bbb) auto | pt, in, cm, mm | em, ex, px left, right o none left, right, both o none

Propiedades tipo de letra


font-family font-size font-weight font-style

Descripcin
Tipo de letra (que puede ser genrico) que vamos a usar. Tamao del tipo de letra. Grosor del tipo de letra (negrita). Estilo del tipo de letra (cursiva).

Posibles valores
lista de tipos, ya sean genricos o no, separados por comas. pt, in, cm, mm | em, ex, px, % | xx-large | xlarge | large |medium | small | x-small | xxsmall | smaller | larger. normal, bold, bolder, lighter o 100-900. normal, italic, , oblique.

Propiedades formato de texto


line-height text-decoration vertical-align text-transform text-align text-indent Interlineado.

Descripcin
Efectos variados sobre el texto. Posicin vertical del texto. Transforma el texto a maysculas o minsculas. Justificacin del texto. Tabulacin con que aparece la primera lnea del texto.

Posibles valores
nmero o porcentaje. none, underline (subrayado), overline (como subrayado, pero por encima), line-through (tachado) o blink (parpadeante); baseline (normal), sub (subndice), super (superndice), top, text-top, middle, bottom, text-bottom o un porcentaje. capitalize (pone la primera letra en maysculas), uppercase (convierte todo a maysculas), lowercase (a minsculas) o none left, right, center o justify +/- pt, in, cm, mm | +/- em, ex, px, %

Propiedades color y fondo


color background background-color background-image background-repeat

Descripcin
Color del texto. Modifica tanto el grfico el color de fondo. Color de fondo de una regin Imagen de fondo de una regin Modo de repeticin del a imagen

Posibles valores
nombre | #RRGGBB | rgb( rrr, ggg, bbb ) direccin del fichero que contiene la imagen o un color. nombre | #RRGGBB | rgb( rrr, ggg, bbb ) none | url(nombre_fichero) repeat | repeat-x | repeat-y | norepeat

La sbana de JavaScript
Variables
var NombreVariable[=Expresin]; var nombrearray=new Array(); // Matrices nombrearray[ndice]=expresin; var define variables y asigna expresiones. Distingue maysculas y minsculas en nombre No pueden contener espacios, , acentos o signos gramaticales (.;: etc.). No pueden comenzar por dgito. Tipos de variables: -Global: Se definen a nivel de <SCRIPT> -Local: Se definen a nivel de funciones //Comentario alert(Expresin); // Ventana de alerta [var=]confirm(Expresin); // Ventana confirmacin

Funciones
<HTML> <HEAD> <SCRIPT> function NombreFuncion([Par1,ParN]) { sentencia(s); } </SCRIPT> <BODY>

IF-ELSE
if (Expresinbooleana) { sentencia(s); } [else] { sentencia(s); } if (ExpBooleana) {sentencia;} Ejemplo: if (edad>=18) {alert("mayor");}

SWITCH
switch (Expresin) { case constante1: sentencia(s); [break; continue;] case constante2: sentencia(s); [break; continue;] [default:] sentencia(s); }

Objeto window
w1=window.open(*); Abrir ventana w1=close(); Cerrar ventana w1.opener; T/F Se abri? w1.closed; T/F Se cerr? w1.Location="URL"; Cargar pgina w1.print Imprimir pg. w1.alert(expr.); Abrir alert w1.confirm(expr.); Abrir confirm w1.prompt(expr.,val); Abrir prompt w1.status="mensaje"; Msj. b.estado Atributos de showModalDialog w1=window.showModalDialog(); showModalDialog("URL";"atributos"); dialogWidth:valor Define ancho dialogHeight:valor " alto dialogTop:valor " pos. superior dialogLeft:valor " pos. izqda. Formato atributos: "atrib1 atrib2 ..."

evento=NombreFuncion([Par1,ParN])
</BODY></HTML>

Entrada de datos
var=prompt(MostrarTexto,ValorInicialVar); nombrecajatexto.value=Expresin;

WHILE
[Inicializacin;] while(condicin[es]) { sentencia(s); [iteracin;] }

DO...WHILE
[Inicializacin;] do { sentencia(s); [iteracin;] } while(condicin);

FOR
for (inicio;condifin;iteracin) { sentencia(s); } Ejemplo: for (cont=1;cont<=10;cont++) {alert("Contador: " +cont);}

Conversin
parseInt(Cadena) parseFloat(Cadena) de nm. a texto numrica boolean String Asignacin Asignacin mltiple Aritmticos Acumula +/-/* Relacionales Lgicos v=Math.sin(valor); v=Math.cos(valor); v=Math.tan(valor); asin(), acos(), atan(); v=Math.abs(valor); v=Math.log(valor); v=Math.max(va,vb); v=Math.min(va,vb); v=Math.pow(b,exp); v=Math.sqrt(valor); v=Math.round(val); v=Math.random()*int; De txt a nm. entero De txt a nm. flotante Automtico Cualquier tipo numrico True o False Cadena alfanumrica

Eventos para ejecutar funciones


onLoad onUnLoad onAbort onError onMouseOver onMouseOut onMouseMove onKeyUp onClick onResize onMove onChange onSelect onFocus onBlur onSubmit onReset Ejecutar al iniciar carga Ejecutar al detener carga Cancelar carga pgina Ejecutar con error Mover el ratn sobre Mover el ratn fuera de Mover el ratn Presionar una tecla Hacer click Cambiar tamao ventana Mover ventana Modificar texto Seleccionar texto Situar el foco Perder el foco Enviar formulario Borrar formulario

Constantes

Estilos (Animaciones)
1) Asignar a las etiquetas de texto un identif. mediante id y a las imgenes un nombre con name (atributos html). 2) Definir llamada a funcin reiterativa. setTimeout(Funcin(),intervalomilseg); 3) Modificar en la funcin el estilo. style=Position:absolute;top:pos;left:pos style=color:nombrecolor style=visibility:hidden | visible Formatos posibles: nometiq.style.estilo=valor;//txt1.style.left=10 nometiq.atributo=valor;//img.src="fot.gif"

Objeto document
document.write(expresin); document.writeln(expresin); document.alinkColor=color; document.alinkColor=color; document.vlinkColor=color; document.bgColor=color; document.fgColor=color; v1=document.referrer; v1=document.location; v1=document.lastModified;

Operadores
variable = expresin; var1=var2=var3=expr. + - * / % -- (-1) ++ (+1) var=+valor = var+valor < > <= >= == != (< >) && (and) || (or) ! (not) Seno de ngulo (radianes) Coseno de un nguno Tangente de un ngulo Igual pero devuelve arcos Valor absoluto de un nm. Logaritmo decimal Devuelve mayor Devuelve menor Potencia de base Raiz cuadrada Redondeo Nm. aleatorio entre 0-int

Objeto Math

Objeto navigator
v1=navigator.appName; v1=navigator.appVer; v1=navigator.userLanguage; v1=navigator.platform; v1=navigator.cpuClass; v1=navigator.connectionSpeed;

Objeto String
var objetostring=new String(); obj.length; Longitud de cadena obj.charAt(p); Caracter de una posicin subString(x,y); Subcadena indexof(letra); Indice de la letra replace(b,s); Bsqueda y sustitucin toLowerCase() Minsculas toUpperCase() Maysculas

Objeto date
var objetodate=new Date(); objetodate.toGMTString(); objetodate.getDate(); objetodate.getMonth()+1; objetodate.getYear(); objetodate.getHours(); objetodate.getMinutes(); objetodate.getSeconds(); setDate();setMonth(); setYear(); ...

*window.open("url","atributos") toolbar=[yes|no] Barra herram. location=[yes|no] Barra direccin directories=[yes|no] Histrico channelmode=[y|n] Barra canales menubar=[yes|no] Barra mens status=[yes|no] Barra estado scrollbars=[yes|no] Barra desplaz. resizable=[yes|no] Dimensionable width=pixels Ancho ventana height=pixels Alto ventana fullscreen=[yes|no] Maximizado top=pixel Pos. superior left=pixel Pos. izquierda Formato atributos: "atrib1 atrib2 ..." Objeto history
window.history.back(); window.history.forward(); window.history.go(valor);

Objeto screen
Antonio Surez Jimnez Andaluca, 2001 var=screen.height; var=screen.width; var=screen.colorDepth;

Vous aimerez peut-être aussi