June 16
Un ombra rende un oggetto 2-D appaiono 3-D, ponendo ombreggiatura dietro di esso. L'ombreggiatura simula una sorgente di luce, rendendo l'oggetto sembrano stare fuori dalla pagina nello spazio 3-D. Prima di HTML5, la versione più recente linguaggio di markup web, e CSS3, l'ultima versione foglio di stile CSS, i progettisti hanno dovuto creare semplici ombre a editor grafici, come ad esempio Photoshop, e poi importarli in Dreamweaver. CSS è un linguaggio di formattazione elemento di pagina comunemente usato nella progettazione di pagine Web. I nuovi standard HTML5 e CSS3 consentono di creare ombre con il codice, che consente di risparmiare tempo e aiuta a mantenere il file nel complesso le pagine Web 'di dimensioni inferiori.
1 Creare un nuovo documento HTML5 in Dreamweaver. Fare clic sul menu "File" e scegliere "Nuovo". Verrà visualizzata la finestra di dialogo Nuovo documento. Scegliere "HTML" dalla lista Tipo di pagina, e poi scegliere "Nessuno" dalla lista Layout. Fai clic sul menu a discesa "DocType" e scegliere "HTML 5," e quindi fare clic su "Crea".
2 Fare clic sul menu "Finestra" e scegliere "stile CSS" per visualizzare il pannello di stile CSS.
3 Fare clic sul pulsante "Aggiungi Nuova regola" nell'angolo in basso a destra del pannello di stile CSS. Questo apre la finestra di dialogo Nuova regola CSS.
4 Tipo ".h1" nel campo "Nome Selector" e quindi fare clic su "OK". È possibile assegnato un nome qualsiasi selettore che si desidera. Con questo selettore, tutto il testo che si tag con <h1> sarà formato in base a questa regola CSS. Questo apre la definizione regola CSS per .h1 finestra di dialogo.
5 Selezionare "Tipo" nell'elenco Categoria per visualizzare le opzioni per la formattazione del testo. Utilizzare queste opzioni per impostare le proprietà, come la famiglia di font, spessore del carattere, dimensione del carattere e il colore del carattere per questa regola CSS.
6 Fai clic su "OK". Dreamweaver crea una nuova regola CSS denominato ".h1" e la mostra e le sue proprietà nel pannello Stili CSS.
7 Fai clic su "Aggiungi proprietà" nel pannello di stile CSS, e quindi digitare "text-shadow" nel campo Aggiungi proprietà. Questa struttura crea un'ombra di testo. Per creare un'ombra sulla scatola CSS o il contenitore, usare "box-shadow".
8 Fare clic sul campo a destra della vostra nuova regola CSS. Viene visualizzata una finestra di dialogo per impostare le proprietà della ombra, come ad esempio X - Offset, Y - Offset, Blur Radius e colori. Queste opzioni controllano il buio e la nitidezza della vostra ombra. Una tipica goccia ombra testo potrebbe utilizzare le seguenti impostazioni:
X-- Offset = "2" pixel
Y-- Offset = "2" pixel
Blur Radius = "5" pixel
Colore = grigio, o "# 333"
È possibile utilizzare tutte le impostazioni che si desidera personalizzare la vostra ombra. Queste impostazioni creano una piacevole ombra, sobrio che sembra buono con il testo.
9 Fare clic nella pagina Web in cui si desidera inserire il testo con un ombra, e quindi fare clic sul menu a discesa "Regola mirata" nel pannello Proprietà e scegliere ".h1."
10 Digitare il testo. Dreamweaver non è in grado di visualizzare l'ombra in visualizzazione struttura. Fare clic sul pulsante "Live View" sotto la barra dei menu per vedere l'ombra.