Elenchi, finestra di dialogo Generatore di stile

Articolo
09/12/2008

Aggiornamento: novembre 2007

La pagina Elenchi della finestra di dialogo Generatore di stile consente di definire gli attributi di stile dei fogli di stile CSS con cui formattare gli elenchi creati con i tag <OL> e <UL>. Questi attributi possono essere applicati direttamente a elementi HTML oppure aggiunti a regole di stile CSS.

Per applicare gli attributi degli elenchi direttamente agli elementi HTML della pagina

Aprire il documento HTML nella visualizzazione Progettazione della finestra di progettazione HTML e selezionare gli elementi da formattare.
Scegliere Stile dal menu Formato per aprire la finestra di dialogo Generatore di stile.
Scegliere Elenchi nel riquadro sinistro della finestra di dialogo Generatore di stile.

Nel riquadro destro verrà visualizzata la finestra di dialogo Generatore di stile, Elenchi.

Quando si formattano elementi selezionati nella visualizzazione Progettazione, gli attributi di stile CSS vengono inseriti inline nel markup HTML della pagina. Passare alla visualizzazione HTML per verificare i nuovi attributi di stile inseriti.

Per aggiungere gli attributi degli elenchi a una regola di stile CSS definita in un foglio di stile esterno

Aprire un foglio di stile esterno e posizionare il punto di inserimento all'interno delle parentesi graffe ({ }) che seguono il selettore dello stile desiderato.
Scegliere Compila stile dal menu Stili per aprire la finestra di dialogo Generatore di stile.
Scegliere Elenchi nel riquadro sinistro della finestra di dialogo Generatore di stile.

Nel riquadro destro verrà visualizzata la finestra di dialogo Generatore di stile, Elenchi.

Nota:
Il menu Stili viene visualizzato quando si apre un foglio di stile CSS esterno per la modifica. L'opzione Compila stile del menu Stili diviene disponibile quando si posiziona il punto di inserimento tra le parentesi graffe che seguono il selettore di una regola di stile.

Una classe di stile CSS definita in un foglio di stile esterno può essere applicata a un elemento all'interno dell'elemento <BODY> di una pagina Web mediante l'assegnazione del selettore di stile CSS come proprietà CLASS per l'elemento.

Le opzioni disponibili nella pagina Elenchi della finestra di dialogo Generatore di stile comprendono:

Attività

Elementi di interfaccia

Elenchi

Consente di impostare gli attributi per il tipo di elenco, che può essere puntato o non puntato. In genere, gli attributi si applicano agli stili relativi ai tag <LI></LI> o <OL></OL> . Selezionare <Non impostato> (nessuna opzione scelta), Puntato o Senza punti elenco. Se, ad esempio, si seleziona Senza punti elenco, verrà aggiunto il seguente codice:

LIST-STYLE-TYPE:none

Elenco puntato

Gli attributi elencati nella tabella riportata di seguito consentono la formattazione degli elenchi puntati. Gli elenchi puntati possono essere contrassegnati da numeri, lettere, numeri romani e immagini per punti elenco standard (a forma di cerchio, disco, quadrato) o personalizzati.

Nota:
I diversi stili per gli elenchi puntati diventano disponibili dopo la selezione di Puntato come tipo di elenco.

Stile
Consente di impostare gli attributi con cui controllare lo stile dei punti elenco. Sono disponibili otto stili. Selezionare un'opzione tra <Non impostato> (nessuna opzione scelta), Cerchio, Disco, Quadrato, (1 2 3 4…), (i ii iii iv…), (I II III IV…), (a b c d...) o (A B C D…). Se, ad esempio, si seleziona Puntato come tipo di elenco e Quadrato come stile, verrà inserito il seguente markup CSS:

LIST-STYLE-TYPE:square
Posizione
Consente di impostare gli attributi per il controllo della posizione del punto elenco rispetto al testo. In relazione alla posizione del testo sono inclusi due diversi formati. Selezionare <Non impostato> (nessuna opzione scelta), Esterno (il testo è rientrato) o Interno(il testo non è rientrato). Se, ad esempio, si seleziona Quadrato come stile, Puntato come tipo di elenco ed Esterno (il testo è rientrato) come posizione, verrà inserito il seguente markup CSS:

LIST-STYLE-TYPE:square; list-style-position:outside
Punto elenco personalizzato
Consente di impostare come stile del punto elenco un'immagine che non rientra negli otto stili disponibili. Dopo la selezione di Punto elenco personalizzato saranno disponibili le opzioni Immagine e Nessuna.
Immagine
Consente di impostare un'immagine come stile del punto elenco. Immettere nel campo il percorso e il nome di un'immagine o scegliere il pulsante con i puntini di sospensione (...) per aprire la finestra di dialogo Seleziona immagine punto elenco e selezionare il percorso dell'immagine desiderata. Se, ad esempio, si seleziona Puntato come tipo di elenco, Esterno (il testo è rientrato) come posizione e Punto elenco personalizzato come stile del punto elenco e quindi si immette bullet.jpg nel campo Immagine, verrà inserito il seguente markup CSS:

LIST-STYLE-POSITION:outside

LIST-STYLE-IMAGE:url (bullet.jpg)
Nessuna
Consente di impostare su None il valore dell'immagine per lo stile del punto elenco. Se, ad esempio, si seleziona Puntato come tipo di elenco, Esterno (il testo è rientrato) come posizione e Punto elenco personalizzato come stile del punto elenco e quindi si immette bullet.jpg nel campo Immagine, verrà inserito il seguente markup CSS:

LIST-STYLE-POSITION:outside; LIST-STYLE-IMAGE:url (bullet.jpg)

Se successivamente si ritorna a Generatore di stile e si seleziona Nessuna come opzione di Punto elenco personalizzato, viene inserito il seguente markup CSS:

LIST-STYLE-POSITION:outside; LIST-STYLE-IMAGE:none