Durante la progettazione di pagine Web, l'immagine sul tuo sito può essere sovrapposto da testo e altri contenuti nella pagina. Per fortuna, avete la possibilità di portare l'immagine avanti con Cascading Style Sheets (CSS). Con i CSS, è utilizzare l'attributo z-index, simile alla funzionalità "porta in primo piano" di un programma di elaborazione testi, per posizionare gli elementi grafici. Utilizzare applicazione editor di testo del tuo computer per applicare i CSS che modifica la posizione della vostra immagine.

Istruzioni

1

Avviare l'editor di testo e aprire il file di sito Web che contiene l'immagine che si desidera modificare.

2

Digitare il seguente codice CSS dopo il tag di apertura < head >:

< style type = "text/css" >

< / stile >

3

Posizionare il cursore tra gli elementi di stile e immettere un segno di numero seguito da un periodo di vostra scelta (ad esempio, "#forward"). Digitare una coppia di parentesi graffe dopo il tuo ingresso, come si vede qui per creare la regola di stile per l'immagine:

avanti {}

Il simbolo di numero crea un Id di CSS, che consente di progettare una regola distinta per una particolare immagine sulla tua pagina.

4

Immettere "position: absolute;" tra le parentesi per indicare al browser per visualizzare la foto esattamente dove si specifica. Inoltre, digitare "z-indice:" e immettere un valore positivo in pixel (px) in questo modo:

avanti {posizione: absolute; z-indice: 5px;}

Lo z-index determina quale ordine dello stack viene visualizzata l'immagine; di conseguenza, un valore positivo superiore specifica che l'immagine è portato avanti in primo luogo.

5

Individuare il codice dell'immagine che si desidera assegnare la regola di stile CSS e immettere "id = #forward" all'interno del tag. Per esempio:

< img id = "#forward" / >

Assicurarsi di sostituire "#forward" con il nome di una regola CSS personalizzata.

6

Salvare il file e visualizzare in anteprima il vostro lavoro in un browser Web per vedere la nuova posizione dell'immagine.