- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- E' possibile con i Css inserire solo una parte di una immagine???
-
E' possibile con i Css inserire solo una parte di una immagine???
Pongo il quesito :
Ipotizziamo di avere un'immagine di 800x700 pixel
e voler inserire in una pagina web solo una parte di questa immagine identificata con il punto in alto a sinista 100,100 e parte destra basso 150,170 in pratica una parte rettangolare dell'immagine.
E' possibile fare questo con i css oppure con qualche altro modo???Intanto che ci sono pongo un'altro quesito
Vorrei mettere (quando avviene un certo evento) una piccola immagine su un'altra immgine più grande in un punto ben preciso.
Si può fare?????Grazie a tutti quelli che mi invieranno consigli.
Franco
-
L'immagine è sempre 800x700 px?
Inoltre necessiti di un doctype particolare del documento?
-
La dimensione dell'immagine è ipotetica. Era solo per indicare che io vorrei poter utilzzare se è possibile solo una parte dell'immagine.
Non sò se può aiutare l'immagine è sempre .gif o .jpg
-
Dimenticavo :
_mi chiedi se necessito di un doctype particolare del documento..mi vergogno... ma non sò che cosa significhi!!!
grazie
-
Con i CSS potresti impostare l'immagine come sfondo di un elemento (per esempio un div di date dimensioni) e poi posizionarla con la proprietà background-position.
Esempio:- L'immagine ha dimensioni 800x600
- vuoi mostrare la parte dell'immagine con coordinate 100,100 (alto,sin) - 150,170 (basso, destra).
- la porzione di immagine che vuoi rappresentare ha pertanto un width di 70 e un height di 50.
CSS
#immagine {
width: 70px;
height: 50px;
background-image: url('img800x600.jpg');
background-repeat: no-repeat;
background-position: -100px -100px;
}html
<div id="immagine"></div>
nella proprietà background-position si possono indicare solamente le coordinate alto, sinistra, per questo motivo è necessario impostare le dimensioni del div e usare le coordinate negative.
Cmq se vuoi un consiglio mi sembra uno spreco di risorse far caricare ai tuoi utenti un'immagine che si vedrà solo in parte (specialmente se è un'immagine pesante)