Propiedad cssText
La propiedad cssText permite establecer
estilos CSS masivamente en una línea. Al hacerlo
todo el contenido del atributo style
se sobrescribe.
Sintaxis
elemento.style.cssText = 'propiedad 1: valor; propiedad 2: valor...'
Ejemplo
Vamos a establecer varios estilos a un elemento:
<p id="elem"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 40px;';
Ejemplo
En este ejemplo, el elemento ya tendrá
estilos iniciales en el atributo style,
pero la propiedad cssText lo sobrescribirá:
<p id="elem" style="background: red;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 20px;';
Ejemplo
Para evitar que se sobrescriban los estilos anteriores, se puede hacer así:
<p id="elem" style="background: green;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText += 'color: red; font-size: 20px;';
Ver también
-
el método
getComputedStyle,
que obtiene el valor de la propiedad CSS de un elemento