August 5
Utilizzando la proprietà "box-shadow" in Cascading Style Sheet codice (CSS), è possibile aggiungere un effetto visivo drop-ombra sotto l'intestazione della pagina Web. Questa tecnica si aggiunge profondità al vostro Web design senza fare i file di immagine del carico richiesta del browser e. Per creare un effetto ombra sottile, utilizzare un codice di colore "RGBA" (rosso, verde, blu e alfa) nel CSS in modo da poter abbassare la trasparenza dell'ombra. Offset l'ombra dall'alto solo così si blocca sotto l'intestazione.
1 Aprire il file contenente il codice per l'intestazione della pagina Web in Blocco note o un editor di codice. Individuare la coppia di tag HTML che iniziano e terminano l'intestazione:
<Div id = "header">
<H1> Benvenuti nel mio sito! </ H1>
</ Div>
Sopra è un semplice esempio di intestazione per una pagina Web. I "<div>" tag iniziano e finiscono l'intestazione. Leggi l'attributo ID nel tag di apertura, in questo caso "header". Aggiungere un ID se non si trova uno.
2 Aggiungere "<style>" tag tra i "<head>" tag del codice della pagina Web se non sono già presenti:
<Style type = "text / css">
</ Style>
Scrivere il codice CSS tra i tag di cui sopra. È inoltre possibile aggiungere i CSS in un file esterno se il vostro sito web utilizza uno.
3 Scrivere il codice per indirizzare l'intestazione in CSS:
#intestazione {}
Aggiungere la proprietà "box-shadow" tra le parentesi graffe:
#intestazione {
box-shadow:
}
4 Aggiungere i valori di vostra proprietà "box-shadow" per impostare la quantità e la direzione dell'ombra offset, la quantità di sfocatura sul ombra e il colore dell'ombra. I primi due valori sono la quantità di compensazione da sinistra e superiore della testata, e il terzo valore è la quantità di sfocatura: "box-shadow: 0px 10px 5px;".
5 I valori di rosso, verde e blu di un colore che si desidera e li usa per il vostro codice di colore RGBA. Utilizzare un valore compreso tra zero e uno per la quantità di trasparenza desiderato per il colore: "box-shadow: 0px 5px 10px rgba (0,0,0,0.5);" Il risultato finale del codice di cui sopra è un'ombra. offset superiormente da cinque pixel, sfocato da un raggio di dieci pixel, con un colore nero impostata a metà trasparenza.