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

javascriptelemento.style.cssText = 'propiedad 1: valor; propiedad 2: valor...'

Ejemplo

Vamos a establecer varios estilos a un elemento:

html<p id="elem"></p>

javascriptlet 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á:

html<p id="elem" style="background: red;"></p>

javascriptlet 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í:

html<p id="elem" style="background: green;"></p>

javascriptlet elem = document.querySelector('#elem');
elem.style.cssText += 'color: red; font-size: 20px;';

Ver también