October 6
Nel codice HTML, elementi DIV creare sezioni distinte di contenuti su una pagina Web. Gli sviluppatori utilizzano DIV in vari modi, a volte nascondere o impilamento contenuto finché non si verifica una certa azione, come l'utente clicca su un link. È possibile utilizzare una combinazione di HTML e Cascading Style Sheets (CSS) per creare elementi DIV e poi mettere uno dietro l'altro, grazie a una proprietà CSS chiamata "z-index". Fino a quando si imposta la proprietà "posizione" di ogni DIV nel codice CSS, è possibile aggiungere un valore "z-index" per impilare i div uno dietro l'altro.
1 Scrivere codice HTML per un elemento DIV e mettere qualunque contenuto che si desidera all'interno dell'apertura <div> e di chiusura </ div> tag. Assegnare il DIV un attributo ID per nominare l'elemento DIV. Si consiglia di scegliere un nome che è unico da qualsiasi altro elemento DIV e non usare lo stesso ID più di una volta sulla stessa pagina web. Ecco un esempio:
<Div id = "firstdiv"> Content va qui ... </ div>
2 Creare un secondo DIV al di sotto del primo e quindi aggiungere qualsiasi contenuto che si desidera che DIV. Dare a questo div un attributo ID con un nome diverso da quello del primo.
<Div id = "seconddiv"> Content va qui ... </ div>
3 Aprire il file CSS o individuare i tag <style> tra i tag <head> nel file HTML si esegue la codifica. È possibile aggiungere i tag <style> se non sono già presenti. Usa il codice CSS per dare ad ogni div un tipo di posizione di "relativa", come mostrato in questo esempio:
firstdiv {position: relative;} seconddiv {position: relative;}
4 Aggiungere la "z-index" per il codice CSS per ogni elemento DIV. Impostare il valore di "z-index" superiore per il DIV che impila sopra l'altro. Il DIV più basso nello stack ottiene il valore più basso "z-index".
firstdiv {position: relative; z-index: 2;} seconddiv {position: relative; z-index: 1;}
È possibile impostare la "z-index" valore compreso tra zero e 999. È possibile utilizzare i valori negativi, ma possono causare problemi di layout complessi e non funzionano nelle versioni precedenti di Internet Explorer.