Quando si visita una pagina Web, è probabile che incontrerete una serie di effetti diversi. Molti effetti, come dissolvenza, sono fatti con una combinazione di tecnologie. Ciò non significa che essi sono complicati da produrre, ma lo fanno utilizzare più di codice HTML solo dritto per completare l'effetto.

HTML

HTML sta per Hyper Text Markup Language. E 'il linguaggio del Web. La sua funzione primaria è quella di creare la struttura della pagina Web. Gli effetti o animazioni incluse nel web non vengono creati con HTML. HTML fornisce il quadro per gli effetti. Detta in cui appariranno alcuni elementi nel browser. È possibile costruire un'intera pagina Web in HTML, ma si sarebbe limitato in modo creativo. HTML viene utilizzato principalmente per la struttura e l'aggiunta di testo; altre funzionalità si aggiunge con linguaggi di script e software di animazione.

CSS

CSS sta per Cascading Style Sheet. Gli elementi di una pagina Web sono in stile con i CSS. CSS permette ai programmatori di dettare uno stile per un particolare elemento, quindi utilizzare per tutta di un sito web. Questo significa che se si voleva tutte le intestazioni di essere audaci e blu, è possibile definire questo stile con una sola riga di codice, e sarebbe applicato ad ogni pagina del sito. Questo elimina la necessità di ricodificare. Con HTML e CSS, è possibile aggiungere un effetto di dissolvenza a un'immagine all'interno della vostra pagina Web.

Alfa

Il filtro cambiamenti CSS alfa vi permetterà di cambiare l'opacità dell'immagine. L'opacità impone come apparirà l'immagine sullo schermo. Più basso è l'opacità, appare più sbiadita l'immagine. La creazione di una dissolvenza è l'esempio perfetto di come HTML e CSS di lavoro insieme. Si utilizzerà HTML per indicare quale immagine per posizionare sullo schermo e CSS per sbiadire l'immagine per l'opacità appropriata.

<Img width = "150" height = "150" alt = stile "MyImage" = "Opacità: 0,4; filtro: alpha (opacità = 40)" />

La riga di codice prende sopra un file di immagine denominato "MyImage" e riduce l'opacità al 40 per cento. L'immagine avrà una dissolvenza un po 'più della metà quando il browser visualizza.

usi

L'effetto di dissolvenza può essere usato un paio di modi diversi. È possibile utilizzare un'immagine sbiadita come sfondo per l'intera pagina Web o mettere una casella trasparente su un'immagine per rendere il testo più leggibile. Opacità può essere modificato quando il visitatore del sito attiva un evento. Ad esempio, è possibile dissolvenza un'immagine per un'opacità del 40 quando l'utente posiziona il mouse su di esso, poi riportarlo al 100 una volta che il mouse esce l'immagine. Questo tipo di effetto è utile quando si vuole indicare che l'utente ha "scelto" una particolare immagine. Un esempio di questo tipo di effetto può essere trovato qui sotto.

<Img style = "opacità: 1; filtro: alpha (opacità = 100)" onmouseover = "this.style.opacity = 0,4; this.filters.alpha.opacity = 40"

onmouseout = "this.style.opacity = 1; this.filters.alpha.opacity = 100" />