La sintassi della clip CSS consente di definire un'area rettangolare di un'immagine più grande che si desidera rendere visibile. C'è un modo per specificare l'inverso? Specifica l'area rettangolare dell'immagine che desideri rendere invisibile. Ti piace dare un buco rettangolare attraverso la pagina per vedere cosa c'è sotto?Esiste un'inversione alla proprietà CSS "Clip"; nascondere l'area ritagliata?
Motivo (se avete altre idee): Voglio creare un'immagine a 3 livelli in un modello CMS. Il livello 1 (in basso) è un'immagine di sfondo. Lo strato 2 si trova su una porzione del livello 1 ed è un'immagine rettangolare di uno screengrab di un documento A4. Il livello 3 (in alto) è un PNG trasparente (al centro e ai bordi) che aggiunge un bordo, un'ombra esterna, un logo del tipo di documento e un effetto di arricciatura della pagina in alto a destra del documento del livello 2.
I livelli 1 e 2 verranno caricati separatamente nel CMS e il CSS dovrebbe combinarli insieme all'immagine del livello 3 per creare l'effetto. Il problema è che l'effetto di arricciatura della pagina funzioni, l'angolo in alto a destra del livello 2 deve essere mascherato in modo che tu possa vedere tutto il percorso dal livello 3 al livello 1. Speravo che la proprietà della clip mi permettesse di specificare un quadratino nell'angolo in alto a destra del livello 2 che dovrebbe essere invisibile.
Alternativa: È necessario utilizzare un programma di grafica per combinare insieme gli strati 1 e 3 e lasciare un'area trasparente per il livello 2. Quindi con il posizionamento corretto è possibile posizionare la nuova immagine combinata sopra al livello 2 per ottenere il stesso effetto. Tuttavia, speravo di evitare una preparazione grafica come questa perché potresti anche creare l'intera immagine in questo modo.
soluzione Bizzarro che mi viene in mente: Disegna l'effetto curl in Layer 3 e l'aggiunta di uno sfondo (stesso sfondo del livello 1) per nascondere il calcio d'angolo. Un po 'sciatto ma veloce ... – Arkana
Grazie per i commenti. Mi ero imbattuto in questo link, ma temo che potrebbe rompersi male su alcuni browser. Sto anche cercando di evitare il lavoro di grafica che estende la quantità di tempo necessaria per sostituire uno dei 3 livelli. Ho avuto un altro pensiero. Potrei rendere Layer 2 un PNG e tagliare manualmente il suo angolo (per essere trasparente) nel programma di grafica. Il mio effetto funzionerebbe e sostituire Layer 1 o Layer 3 attraverso il sito sarebbe stato facile. – Dominic