18. Modificació de les especificacions d'estil

 

Índex

Aspectes generals

Podem produir canvis d'estil en els elements que en el codi HTML hagin estat identificats amb id. La identificació dels estils es fa amb getElementById().style.atribut. Cal doncs una instrucció d'assignació amb la forma següent:

Les denominacions dels atributs són semblants a les que es fan servir en el CSS, però cal tenir present que el guionet que es fa servir en CSS per a la denominació d'algunes propietats s'ha de suprimir en JavaScript, i a canvi cal escriure majúscula la lletra següent. Així cal emprar fontFamily en lloc de font-family, textDecoration en lloc de text-decoration, etc.

 

Canvis d'estil en els elements de text

Podem canviar l'estil dels elements de text (P, BLOCKQUOTE, H1 i similars, TD, TH, etc.), mitjançant les propietats

i anàlogues

A més, podem modificar els colors de fons d'un element amb la propietat

Exemple

 

Modificació de la visibilitat de les capes

La visibilitat de les capes es pot modificar amb dos procediments:

Exemple

Exemple
Exemple

 

L'estil i la resolució de la pantalla

Ja sabem que els documents HTML no tenen una veritable amplada, sinó que s'acomoden a ocupar tot l'espai lliure en la pantalla, llevat que hi hagi algun mecanisme que ho impedeixi. Això comporta dificultats quan dins el document hi ha elements especificats amb mides absolutes. Una imatge de 400 píxels d'amplada ocupa la meitat de l'amplada de la pantalla si aquesta funciona amb una resolució de 600x800; però si la resolució és de 768x1024 ocuparà només el 40% de l'amplada.

Hi ha el recurs de mesurar la resolució de la pantalla, amb screen.width i screen.height, a continuació fer els càlculs adequats amb les dades resultants, i proveir diverses alternatives a fi que en cada cas el resultat sigui el mateix o molt semblant.

Exemple