ciao
vorrei usare i div ma nn capisco perchè se li posiziono in un certo punto del layout questi quando faccio l'anteprima si spostano e nn mantengono la posizione che avevo inizialmente dato![]()
come mai? come posso ovviare?
![]()
ciao
vorrei usare i div ma nn capisco perchè se li posiziono in un certo punto del layout questi quando faccio l'anteprima si spostano e nn mantengono la posizione che avevo inizialmente dato![]()
come mai? come posso ovviare?
![]()
ciao, allora i div funzionano in modalità block, ogniuno porta via una determinata porzione della pagina. Normalmente i div, vengono posizionanti nella pagina o inmodalita assoluta o in posizione fissa. Sembrano la stesa cosa ma non lo sono:
la posizione assuluta è una posizione indicata e dichiarata nei css ed è relativa a qualcosa, di base all'angolo superiore sinistro dello schermo.
La posizione fissa, invece è la reale posizione del div, nella pagina.
...
Forse è più facile fare un esempio!!
Comunque posta il codice che non capisci che te lo si spiega...
![]()
questo è il codice che mi ha generato Dreamweaver
<div id="Layer1" style="position:absolute; width:115px; height:30px; z-index:1; left: 123px; top: 307px">sezione1</div>
![]()
grazie per l'aiuto![]()
allora quando lavori con i livelli e usi DW (lo uso anche io) non devi lavorare in modalità visuale ma in modalità codice.
Elimina dal tag il parametro style, e usa i css:
<div id="Layer1">sezione 1</div>
poi nei css, vai ad impostare i dati relativi;
<style>
#Layer1 {
position:absolute;
width:115px;
height:30px;
z-index:1;
left: 123px;
top: 307px;
}
</style>
spiegazioni:
#Layer1indica che il riferimento è ad un ID : id=""
.Layer1 indica che il riferimento è ad una classe : class=""
layer1 indica tutti i tag : <layer1></Layer1> logiamente layer non esiste.
gli stili:
position:absolute;
indichi che la posizione nella pagina è assoluta
width:115px;height:30px;
ne specifichi la larghezza e l'altezza
z-index:1;
ne specifichi la posizione di livello (hai presente nei programmi di grafica i livelli se scrivi in quello superiore non vedi quello che c'è sotto, funziona cosi anche qui.)
left: 123px;top: 307px;
imposti in pixel la posizione da sinistra e dall'alto inrelazione all'angolo in alto a sinistra dello schermo e in alto a sinistra del livello
per farti capire in pratica lo z-index e il left e top guarda l'allegato.
Quella è la tua pagina, il livello 1 a z-index 1 eil livello 2 a z-index 2 e ogniuno ha il suo top e left con position absolute. Poichè non c'è nessuna impostazione di relative, viene impostato in automatico il bordo della pagina.
grazie![]()
ci provo
![]()
mi sa ke nn ho capitoil livello che faccio una volta esportato nn va mai nella posizione da me richiesta
![]()
se tu posizioni un livello ad esempio con left:100px;
e top:100px; te lo ritrovi a 100px da sinistra e 100 dall'alto. In base a questo devi impostare la pagina. Se lo fai con dw in modalità visiva, ti ritroverài tutto storto il layout perchè non riesci ad impostarlo in modo corretto. Se invece lo fai in modalità codice la cosa risulta più semplice.
guarda questo codice, è la parte del body:
questo invece è il css associatocodice:<body> <div id="liv1">Questo è il livello 1 <div id="liv2">Questo è il livello 2</div> <div id="liv3">Questo è il livello 3</div> </div> </body>
prova ora a lavorare su questo scritto e magari capisci più facilmente il modo di operarecodice:/* Il livello 1 viene utilizzato per contenere gli altri due livelli e i due livelli vengono posizionati relativemante al primo */ #liv1{ position:relative; width:500px; height:300px; background:#9c9; border:1px solid #000; } #liv2{ position:absolute; width:400px; height:70px margin:0px; padding:0px; top:0px; left:100px; background:#c63; } #liv3{ position:absolute; width:130px; height:40px; margin:0px; padding:0px; top:120px; left:0px; background:#3c6; }
grazie sei pazientissimo![]()
ci riprovo
![]()