recuperato dall'altro thread:

Originariamente inviato da decori
Rebelia
grazie come sempre per la tua esauriente risposta ma a me non riesce proprio salvare i vari pezzettini come dici te... un esempio è questo

insomma anche se sono andato sui vari livelli e ho ritagliato i vari rettangoli non sono riuscito a salvarli diversamente da questa immagine in allegato... come mai ?

ma come vanno salvati ? c'è un formato diverso , e poi mi dici di lavorare sulla pagina coi css?dici quelli?
...ma come li applichi su un'immagine non capisco....

inoltre come si fa a trascinare i due livelli per creare quell'effetto che spieghi te, del rosso scuro sopra il grigio?

non ti seguo piu', percio' ripartiamo da zero

apro gimp creo una nuova immagine: file -> nuovo -> imposto larghezza e altezza -> ok

aggiungo un livello per ogni elemento: livello -> nuovo livello

fino a ottenere qualcosa tipo questa: sfondo bianco su un livello, sfondo sfumato su un altro livello e testo sul terzo livello (clicca sulla miniatura e ti si aprira' l'immagine grande)



poi decido di spostare il testo, quindi clicco sullo strumento a croce evidenziato a sinistra, clicco sul testo e TENENDO PREMUTO IL MOUSE trascino il testo nella posizione desiderata:



ti faccio inoltre notare che ANCORA NON HO SALVATO NULLA (me lo indica il nome generico "immagine" evidenziato qua sopra, dato in automatico dal programma); procedo percio' a salvare il file UNA PRIMA VOLTA nel formato proprietario di gimp che MANTIENE I LIVELLI:



e una seconda volta nel formato GIF che APPIATTISCE TUTTO:



i files qui sopra sono stati salvati, chiusi e poi riaperti e come vedi il primo (ciao.xcf) ha mantenuto i livelli (li vedi evidenziati a sinistra), mentre il secondo (ciao.gif) non li ha mantenuti

a questo punto prendi IL FILE APPIATTITO (cioe' ciao.gif) e posizioni le guide per procedere al ritaglio; prima di farlo, assicurati che la voce relativa sia spuntata: visualizza -> mostra le guide

clicca sul righello laterale e TENENDO PREMUTO IL TASTO DEL MOUSE trascina verso il centro dell'immagine: si creera' la guida



procedi poi con tutte le altre fino a riquadrare tutti i pezzi che intendi ritagliare:



a questo punto assicurati che siano attive le guide magnetiche: visualizza -> guide magnetiche

quindi ATTIVA LO STRUMENTO SELEZIONE RETTANGOLARE (e' quello evidenziato sulla sinistra in alto) e ritaglia il primo pezzo che ti serve, quindi fai modifica -> copia e quindi modifica -> incolla come nuovo

ti si aprira' una nuova finestra contenente il pezzo di file che desideri; procedi cosi' fino a quando hai ritagliato tutti i pezzi; io ne ho ritagliati due e ho ottenuto due nuove immagini, ognuna delle quali e' uno dei pezzi che desideravo:



vorre farti notare anche come quando mi sposto su un'immagine piuttosto che sull'altra, cambia il contenuto del pannello degli strumenti (particolari segnati in nero); la finestra attiva (cioe' quella su cui vado ad agire se faccio una qualsiasi cosa) e' quella con il bordo in alto blu

ok e questo e' quanto per la preparazione dei pezzi; a questo punto mi ritrovo con le due sezioni che mi servono per decorare la mia pagina web, cioe' queste:



quella di sinistra (n. 1) e' alto.gif e quella di destra (n. 2) e' basso.gif

ATTENZIONE! ORA ANDIAMO OT in via del tutto eccezionale ti spiego qua sotto un breve passaggio dei css, ma se poi vuoi spiegazioni piu' dettagliate, devi forzatamente postare nel forum apposito, mi raccomando!

poniamo che io abbia una pagina html tipo questa (mettero' solo lo stretto indispensabile):

codice:
<html>
   <head>
      <title>prova</title>
   </head>
   
   <body>
   <h1>risultati delle premiazioni</h1>
   <table>
      <tr>
         <td> 4 </td>
         <td> 5 </td>
         <td> 2 </td>
         <td> 7 </td>
      </tr>
   </table>

   </body>
</html>
per decorare la pagina qui sopra (salvata poniamo come index.html) con le immagini che ho preparato, scrivero' un css in questo modo:

codice:
body {background: url(alto.gif) no-repeat top left;}

table {background: url(basso.gif) repeat-x top left;}
e lo salvero' per esempio come stile.css

quindi per fare in modo che la pagina veda il css, nella pagina index.html MODIFICO la parte tra <head> e </head> AGGIUNGENDO LA STRINGA "LINK" in questo modo:

codice:
<html>
   <head>
      <title>prova</title>

      <link href="stile.css" rel="stylesheet" type="text/css" />

   </head>
   
   <body>
   <h1>risultati delle premiazioni</h1>
   <table>
      <tr>
         <td> 4 </td>
         <td> 5 </td>
         <td> 2 </td>
         <td> 7 </td>
      </tr>
   </table>

   </body>
</html>
spero di essere stata chiara

detto questo, ho guardato la tua immagine, ma non capisco dove stia il problema: non riesci a ritagliare o non riesci a montare le immagini? nel primo caso continuiamo pure la discussione qua, mentre se hai dubbi sui css o sul codice, come dicevo per favore posta nelle sezioni corrette