Precedente :: Successivo |
Autore |
Messaggio |
pietro
Registrato: 02/04/07 07:17 Messaggi: 158
|
Inviato: Mer 09 Mag 2007 10:11 Oggetto: Css e posizionamento immagine in background |
|
|
ciao,
sto cercando di realizzare il mio sito web, a tal fine sto studiano l'html ed i css.
Ho incontrato uno scoglio: come faccio a dirgli di posizionare in un box, un'immagine in background a 10 pixel da un bordo.
La situazione è questa:
------
#colonna-2 {
margin-left: 160px;
background: url(Immagine.png) right top no-repeat fixed #CC9;
color: #630;
padding-left: 3px;
------
vorrei che mettesse Immagine.png a dieci pixel dal bordo di destra, ma non ci sono riuscito.
Padding e border sono impostati allo stesso modo per tutti i box.
Seconda domanda, potreste indicarmi una guida o manuale, preferibilmente in rete, per la gestione delle immagini sul web? Devo capire quali formati convengas usare, livelli di compressione, ....
Grazie.
ciao, Pietro
--
utente linux n° 394928
macchina linux n° 311519
Pgp key: 1024D/92718B45 |
|
Top |
|
|
ap
Registrato: 07/05/07 14:55 Messaggi: 197 Residenza: Bologna
|
Inviato: Mer 09 Mag 2007 12:30 Oggetto: Css e posizionamento immagine in background |
|
|
On 9 May 2007, at 11:11, pietro barnabè wrote:
Citazione: | Ho incontrato uno scoglio: come faccio a dirgli di posizionare in
un box, un'immagine in background a 10 pixel da un bordo.
La situazione è questa:
------
#colonna-2 {
margin-left: 160px;
background: url(Immagine.png) right top no-repeat fixed #CC9;
color: #630;
padding-left: 3px;
------
vorrei che mettesse Immagine.png a dieci pixel dal bordo di destra,
ma non ci sono riuscito.
Padding e border sono impostati allo stesso modo per tutti i box.
|
Ma 10 pixex non è già il padding (o margine, chi si ricorda! :-) ) di
default?
BTW, prova con un:
background: #CC9 url(Immagine.png) no-repeat fixed 10px 10px;
Non l'ho provato, ma dovrebbe andare
HTH,
- ap |
|
Top |
|
|
pietro
Registrato: 02/04/07 07:17 Messaggi: 158
|
Inviato: Mer 09 Mag 2007 13:41 Oggetto: Css e posizionamento immagine in background |
|
|
On Wed, 9 May 2007 13:30:31 +0200
Andrea Paolini <ap@xxxxxx.xyz> wrote:
Citazione: | Citazione: | La situazione è questa:
------
#colonna-2 {
margin-left: 160px;
background: url(Immagine.png) right top no-repeat fixed #CC9;
color: #630;
padding-left: 3px;
------
| ......
background: #CC9 url(Immagine.png) no-repeat fixed 10px 10px;
|
Non funzia, provato anche portando a 20px, se metto un solo valore la posiziona come vorrei io, ma lo fa rispetto al margine superiore e non su quello destro, con due valori, si azzera il background.
Grazie.
ciao, Pietro
--
utente linux n° 394928
macchina linux n° 311519
Pgp key: 1024D/92718B45 |
|
Top |
|
|
ap
Registrato: 07/05/07 14:55 Messaggi: 197 Residenza: Bologna
|
Inviato: Mer 09 Mag 2007 16:22 Oggetto: Css e posizionamento immagine in background |
|
|
On 9 May 2007, at 14:41, pietro barnabè wrote:
Citazione: | Citazione: | background: #CC9 url(Immagine.png) no-repeat fixed 10px 10px;
|
Non funzia, provato anche portando a 20px, se metto un solo valore
la posiziona come vorrei io, ma lo fa rispetto al margine superiore
e non su quello destro, con due valori, si azzera il background.
|
Oops... avevo letto SINISTRO!
- ap_______________________________________________
Erlug mailing list
Erlug@xxxxxx.xyz
http://erlug.linux.it/cgi-bin/mailman/listinfo/erlug
-----------------------------------------------------------
ErLUG webzine: http://erlug.linux.it
Manuali FDL:
LinuxFacile - http://www.linuxfacile.org
Linux Da Zero - http://erlug.linux.it/linuxdazero/
Connettivita' offerta da Ehiweb.it - http://www.ehiweb.it/
----------------------------------------------------------- |
|
Top |
|
|
lucabb
Registrato: 04/04/07 16:11 Messaggi: 15
|
Inviato: Mer 09 Mag 2007 18:07 Oggetto: Css e posizionamento immagine in background |
|
|
pietro barnabè wrote:
Citazione: | Ho incontrato uno scoglio: come faccio a dirgli di posizionare in un box,
un'immagine in background a 10 pixel da un bordo.
La situazione è questa:
| [cut]
Citazione: | vorrei che mettesse Immagine.png a dieci pixel dal bordo di destra, ma non ci sono riuscito.
Padding e border sono impostati allo stesso modo per tutti i box.
|
Da quello che so non puoi impostare un bordo per le img di background.
Puoi cercare di 'ingannare' con qualche trucco:
1) usare un posizionamento percentuale, ma quando ridimensioni la
finestra del browser ti cambia tutto:
background: #CC9 url(./immagine.jpg) 98% 10% no-repeat;
2) Applicare border/padding all'elemento contenitore, mettere l'img in
un div da sola (specificando le dimensioni del div uguali a quelle
dell'immagine) e posizionare quest'ultimo.
3) Aggiungi all'immagine 10px di bordo bianco con gimp :)
Spulciando in giro ho trovato la proprietà Direction [ltr | trl|
inherit] che specifica la direzione di scritture dei blocchi, magari può
esserti utile...
Citazione: | Seconda domanda, potreste indicarmi una guida o manuale, preferibilmente in rete,
Per la gestione delle immagini sul web? Devo capire quali formati
convengas usare, livelli di compressione, ....
|
Prova questi:
http://www.htmlgoodies.com/tutorials/web_graphics/article.php/3479931
http://webmaster.lycos.it/topics/graphic/design/design-workshop5/
Luca |
|
Top |
|
|
pietro
Registrato: 02/04/07 07:17 Messaggi: 158
|
Inviato: Mer 09 Mag 2007 18:13 Oggetto: Css e posizionamento immagine in background |
|
|
On Wed, 9 May 2007 17:22:24 +0200
Andrea Paolini <ap@xxxxxx.xyz> wrote:
Citazione: | Oops... avevo letto SINISTRO!
| Potrei anche avere scritto sinistro, sbagliando.
Grazie comunque.
ciao, Pietro
--
utente linux n° 394928
macchina linux n° 311519
Pgp key: 1024D/92718B45 |
|
Top |
|
|
ap
Registrato: 07/05/07 14:55 Messaggi: 197 Residenza: Bologna
|
Inviato: Mer 09 Mag 2007 18:17 Oggetto: Css e posizionamento immagine in background |
|
|
On Wed, May 09, 2007 at 07:13:06PM +0200, pietro barnab? wrote:
Citazione: | Citazione: | Oops... avevo letto SINISTRO!
| Potrei anche avere scritto sinistro, sbagliando.
|
No no, sono io che sono arteriosclerotico... :-)
- ap |
|
Top |
|
|
pietro
Registrato: 02/04/07 07:17 Messaggi: 158
|
Inviato: Mer 09 Mag 2007 18:32 Oggetto: Css e posizionamento immagine in background |
|
|
On Wed, 09 May 2007 19:07:18 +0200
Luca Busi <luca@xxxxxx.xyz> wrote:
Citazione: | Da quello che so non puoi impostare un bordo per le img di background.
|
Temevo fosse così, visto che sul manuale che ho non ne parla.
Citazione: | 1) usare un posizionamento percentuale, ma quando ridimensioni la
finestra del browser ti cambia tutto:
|
avevo provato, ma preferisco tenerla scentrata.
Citazione: | 2) Applicare border/padding all'elemento contenitore, mettere l'img in
un div da sola (specificando le dimensioni del div uguali a quelle
dell'immagine) e posizionare quest'ultimo.
|
Sperimenterò questa soluzione.
Citazione: | 3) Aggiungi all'immagine 10px di bordo bianco con gimp :)
|
questa è interessante.
Grazie, belle le guide, soprattutto la prima.
ciao, Pietro
--
utente linux n° 394928
macchina linux n° 311519
Pgp key: 1024D/92718B45 |
|
Top |
|
|
pietro
Registrato: 02/04/07 07:17 Messaggi: 158
|
Inviato: Sab 12 Mag 2007 09:10 Oggetto: Css e posizionamento immagine in background [risolto] |
|
|
On Wed, 09 May 2007 19:07:18 +0200
Luca Busi <luca@xxxxxx.xyz> wrote:
Citazione: | Da quello che so non puoi impostare un bordo per le img di background.
|
confermo, dopo giorni di tentativi.
Citazione: | 2) Applicare border/padding all'elemento contenitore, mettere l'img in
un div da sola (specificando le dimensioni del div uguali a quelle
dell'immagine) e posizionare quest'ultimo.
|
Non mi piaceva il risultato, poi dieci di righe di codice in meno mi hanno fatto optare per la terza opzione:
Citazione: | 3) Aggiungi all'immagine 10px di bordo bianco con gimp :)
| Gimp accetta anche lo sfondo trasparente, con il copia incolla ho trasportato l'immagine su uno sfondo ridimensionato, posizionata con lo strumento sposta (o muovi), ed il gioco è fatto.
Grazie per l'aiuto.
Pietro
--
utente linux n° 394928
macchina linux n° 311519
Pgp key: 1024D/92718B45 |
|
Top |
|
|
|
|
Non puoi inserire nuovi argomenti Non puoi rispondere a nessun argomento Non puoi modificare i tuoi messaggi Non puoi cancellare i tuoi messaggi Non puoi votare nei sondaggi
|
|