El fons d’una pàgina web es pot relacionar amb el seu contingut o comportar-se independentment d’ella. En el primer cas, quan es desplaça contingut per la finestra del navegador, la imatge de fons també es desplaçarà, mentre que en el segon, pot romandre estacionària. Per implementar un fons de pàgina fix, heu d’utilitzar el llenguatge de descripció de l’estil CSS; només pot garantir el mateix comportament en segon pla en diferents tipus de navegadors.
Instruccions
Pas 1
Utilitzeu la propietat adjunt de fons a CSS per especificar si el fons de la pàgina ha de ser fix o mòbil. En total, aquesta propietat pot tenir tres valors: si no n'especifiqueu cap, el fitxer adjunt de fons es considerarà per defecte com a desplaçament. Amb aquest valor, la imatge de fons es desplaça juntament amb el contingut de la pàgina. El valor hereta copia el comportament de fons de l'element pare i el valor fix fa que la imatge de fons sigui independent del contingut; es manté estacionari quan es desplaça la pàgina. L’hauríeu d’utilitzar.
Pas 2
Prepareu les instruccions CSS per utilitzar-les a les pàgines que vulgueu corregir el fons. Si no col·loqueu el codi CSS en un fitxer de descripció d'estil extern, aquestes instruccions haurien de situar-se entre les etiquetes d'estil d'obertura i de tancament:
// hi haurà descripcions d’estils
La descripció del comportament del fons de la pàgina ha d'estar lligada a l'element BODY; en la terminologia CSS s'anomenarà "selector" i s'escriurà així: BODY {
// les descripcions del cos de la pàgina seran aquí
} Les propietats relacionades amb aquest selector s’han de col·locar dins de claus, separades per punts i coma: BODY {
arxiu adjunt de fons: fix;
imatge de fons: url (images / BG.gif);
} La primera línia captura la imatge de fons i la segona indica l'adreça del fitxer que conté la imatge de fons, en relació amb l'adreça de la pàgina. Aquestes dues línies es poden escriure en una declaració CSS complexa com aquesta: background: url (images / BG.gif) fix;
Pas 3
Enganxeu tot el codi per fixar el fons al text de la pàgina. En la seva forma acabada, pot semblar així:
BODY {background: url (images / BG.gif) corregit;}
Per descomptat, heu de substituir la ubicació i el nom del fitxer d’imatges de fons. És millor posar el codi abans de l'etiqueta, tot i que no és un requisit previ.
