Cómo configurar el estilo del formulario html usando js
En primer lugar, comprenda la tabla de comparación de atributos de estilo de etiquetas CSS y JS:
Tabla de comparación de atributos de estilo de etiquetas CSS y JavaScript:
Comparación de atributos y etiquetas de cuadro
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
borde borde
borde-inferior bordeInferior
borde- color inferior bordeBottomColor
borde-estilo inferior bordeBottomStyle
borde-ancho inferior bordeBottomWidth
color del borde bordeColor
borde- borde izquierdoLeft
borde-color-izquierdo borderLeftColor
borde-estilo-izquierdo borderLeftStyle
borde-ancho-izquierdo borderLeftWidth
borde- borde derechoDerecho
borde-color-derecho bordeDerechoColor
borde-estilo-derecho bordeDerechoEstilo
borde-ancho-derecho bordeDerechoAncho
borde- estilo bordeEstilo
borde-superior bordeTop
borde-superior-color bordeTopColor
borde-superior-estilo bordeTopEstilo
borde-superior- ancho bordeTopWidth
ancho de borde borderWidth
ancho de borde borderWidth
p>
borrar borrar
float floatStyle
margen margen
margen inferior margen inferior
margen izquierdo margen izquierdo
margen-derecho margenDerecho
margen-superior margenSuperior
relleno relleno
relleno-inferior rellenoInferior
relleno-izquierdo rellenoIzquierdo
padding-right paddingRight
padding-top paddingTop
Etiquetas de color y fondo y comparación de atributos
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
fondo fondo
fondo-attachment fondoAttachment
fondo-color fondoColor
fondo-imagen fondoImagen
posición de fondo posición de fondo
repetición de fondo repetición de fondo
color color
comparación de atributos y etiquetas de estilo
sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
display display
list-style-type listStyleType
list-style-image listStyleImage
list-style-position listStylePosition
list-style listStyle
white-space whiteSpace
Etiqueta de estilo de texto y comparación de atributos
p>
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
fuente fuente
font-family fontFamily
font- tamaño
fontSize
font-style fontStyle
font-variant fontVariant
font-weight fontWeight
Etiqueta de texto y comparación de atributos
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
espaciado entre letras espaciado entre letras
salto de línea salto de línea
alto de línea altura de línea
text-align textAlign
text-decoration textDecoration
text-indent textIndent
text-justify textJustify
text-transform textTransform
vertical-align verticalAlign
lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//ES"gt;
lt;HTMLgt;
lt;HEADgt;
lt;TITLEgt; Nuevo documento lt;/TITLEgt; p>
lt; lenguaje de script="javascript"gt;
función validar(){
if (document.all("nombre").valor == " " ){
document.all("name").style["borderColor"]="red"; //Esto es
return
}
}
lt;/scriptgt;
lt;BODYgt;
lt;input type="text" nombre=" nombre" gt;
lt;/BODYgt;
lt;/HTMLgt;