Come definire gli stili con Tag Selector in Dreamweaver - dummies

Puoi creare completamente nuovi stili in Dreamweaver usando i selettori di chiamata o ID, ma puoi anche creare stili che modificano la formattazione di HTML esistente tag. Questi stili vengono creati utilizzando il selettore di tag , che è anche noto come selettore di elementi . Quando definisci uno stile utilizzando il selettore di tag, puoi modificare l'aspetto, la posizione e altre funzionalità di qualsiasi tag HTML esistente.

Molti tag HTML includono già opzioni di formattazione. Ad esempio, i tag di intestazione includono la formattazione in stile testo utilizzando un grande carattere grassetto. Quando crei uno stile con un selettore di tag, devi considerare le opzioni di formattazione già associate a quel tag. Qualsiasi opzione definita verrà aggiunta alla formattazione esistente o sostituirà la formattazione.

Potresti chiedere, "Perché dovrei ridefinire il tag

invece di creare un nuovo stile di titolo usando il selettore di classe o ID? "Sebbene tu possa definire un nuovo stile di classe invece di ridefinire un tag HTML, a volte usare un tag HTML esistente è meglio.

Gli stili di intestazione sono particolarmente importanti sul Web perché il testo formattato in un tag

è riconosciuto come il testo più importante in una pagina. Tra le altre cose, il testo formattato in un tag

potrebbe ricevere una considerazione speciale dai motori di ricerca.

Per creare uno stile che ridefinisce un tag HTML (come il tag

) con il selettore di tag, prima creare un file o aprirne uno esistente e quindi seguire questi passaggi:

1Nel pannello Selettori del pannello Designer CSS, selezionare il foglio di stile a cui si desidera aggiungere il nuovo stile.

Quando si crea uno stile per un tag HTML esistente, non è necessario applicare lo stile stesso come si fa con gli stili di classe e ID. Ovunque tu abbia usato il tag HTML, vengono applicate le impostazioni di definizione dello stile.

2Se si desidera indirizzare lo stile a un tipo di supporto o una dimensione dello schermo specifici, scegliere o definire una query multimediale nel pannello @Media.

L'uso di query multimediali con stili è facoltativo. Se non si specifica una query multimediale, Dreamweaver utilizzerà la proprietà Global e il proprio stile funzionerà in tutti i formati multimediali e le dimensioni dello schermo.

3Fare clic sul segno più (+) nel pannello Selettori.

Un nuovo selettore viene aggiunto al pannello Selettori.

Quando fai clic sul segno più (+) per creare un nuovo selettore, alcune cose possono accadere, a seconda di ciò che è già aperto sulla pagina in Dreamweaver. La prima volta che si crea uno stile in una pagina Web vuota, Dreamweaver inserisce il corpo nel pannello Selettori.

Se stai lavorando su una pagina con testo o altro contenuto formattato con tag o stili HTML, Dreamweaver può aggiungere un selettore composto basato sugli elementi che circondano qualsiasi cosa tu abbia selezionato con il cursore.

4Nel pannello Selettori, fare doppio clic sul nome del selettore. Iniziare a inserire il nome del tag HTML, quindi selezionare il tag dall'elenco a discesa visualizzato.

Puoi inserire il nome di qualsiasi tag HTML per creare uno stile usando il selettore di tag. Mentre digiti un tag HTML, viene visualizzato un elenco a discesa con tag che iniziano con la stessa lettera che hai digitato. Selezionare la tag desiderata dall'elenco invece di digitare l'intero nome del tag è una buona pratica perché si evitano errori di battitura.

5Nel pannello Proprietà, specificare le impostazioni desiderate nella regola dello stile.

Il carattere e il colore vengono immediatamente applicati al testo nella pagina formattata con il tag

.

Se si desidera poter utilizzare lo stesso tag HTML con una formattazione diversa in parti diverse della stessa pagina, è possibile creare stili composti. Gli stili composti sono utili, ad esempio, se si desidera che il testo formattato con il tag

abbia un aspetto diverso nella parte principale della pagina rispetto a una barra laterale.