Muchas propiedades de estilo CSS tienen guiones en sus nombres, que se interpretan como signos menos en JavaScript.
Por lo tanto, los nombres de propiedades de los objetos CSS2Properties son algo diferentes de los nombres de propiedades CSS reales.
Si el nombre de una propiedad CSS contiene uno o más guiones, es necesario eliminarlos en JS y las letras originales inmediatamente después de los guiones se deben cambiar a mayúsculas.
Cabe señalar que float es una palabra clave en JS, por lo que en JS float se escribe como cssFloat o floatStyle.
La siguiente es una tabla de comparación entre las propiedades CSS y la codificación CSS en JavaScript:
Etiqueta de caja y comparación de atributos:
Código
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
frontera frontera
borde inferior borde inferior
borde-color-inferior bordeBottomColor
borde-fondo-estilo bordeBottomStyle
borde-inferior-ancho bordeInferiorAncho
color del borde color del borde
frontera-izquierda fronteraIzquierda
borde-izquierdo-color bordeIzquierdoColor
borde-estilo-izquierdo bordeLeftStyle
borde-ancho-izquierdo bordeLeftWidth
frontera-derecha fronteraDerecha
borde-color-derecho bordeDerechoColor
borde-estilo-derecho bordeDerechoEstilo
borde-ancho-derecho bordeDerechoWidth
estilo de borde estilo de borde
borde superior borde superior
borde-color-superior bordeTopColor
borde-top-estilo bordeTopStyle
borde-ancho superior bordeTopWidth
ancho de borde ancho de borde
claro claro
float floatStyle(es decir) cssFloat(FF)
margen margen
margen inferior margen inferior
margen izquierdo margen izquierdo
margen derecho margen derecho
margen superior margen superior
relleno relleno
acolchado inferior acolchado inferior
relleno-izquierda paddingLeft
padding-right paddingRight
acolchado superior paddingTop
Comparación de atributos y etiquetas de color y fondo:
Código
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
fondo de fondo
fondo-adjunto fondoAdjunto
color de fondo color de fondo
imagen de fondo imagen de fondo
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:
Código
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
pantalla de visualización
lista-estilo-tipo listStyleType
lista-estilo-imagen listStyleImage
lista-estilo-posición listStylePosition
estilo de lista estilo de lista
espacio en blanco espacio en blanco
Etiqueta de estilo de texto y comparación de atributos:
Código
Sintaxis CSS (no distingue entre mayúsculas y minúsculas) Sintaxis de JavaScript (distingue entre mayúsculas y minúsculas)
fuente fuente
familia de fuentes fontFamily
tamaño de fuente Tamaño de fuente
estilo de fuente estilo de fuente
variante de fuente fontVariant
peso de fuente peso de fuente
Etiqueta de texto y comparación de atributos:
Código
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
altura de línea altura de línea
alinear texto alinear texto
decoración de texto decoración de texto
sangría de texto sangría de texto
justificar texto justificar texto
transformación de texto transformación de texto
alineación vertical alineación vertical