NOTA! Questo sito utilizza i cookie e tecnologie simili.

Se non si modificano le impostazioni del browser, l'utente accetta. Per saperne di piu'

Approvo

Capitolo 5: Le liste.

 

Tramite i CSS possiamo modificare l'aspetto dei tag LI (list item) delle liste html.

 

Possiamo impostare le seguenti proprietà:

  • list-style-image: url('/[path file immagine]')

Permette di utilizzare, come marker (marcatore, simbolo) di un elemento della lista un'immagine, reperibile all'url specificato come argomento di url([path]).

 

  • list-style-position: inside | outside

Consente di definire la posizione del marker dell'elemento della lista in relazione al testo di tale elemento.

I valori possono essere:

  • inside --- il marker fa parte del testo, appartiene al suo "box", verrà visualizzato all'interno del testo in caso di visualizzazione dello stesso su più righe.
  • outside --- il marker si trova al di fuori del "box" del testo (più precisamente, alla sua sinistra). E' il comportamento di default.

 

 

  • list-style-type: [varie opzioni, vd. elenco nella descrizione]

Definisce l'aspetto del marker di un elemento della lista.

Possibili valori:

disc Un cerchio pieno. Il colore di riempimento può essere impostato mediante una regola color per il contenitore della lista.
circle Un cerchio vuoto.
square Un quadrato.
decimal Numeri interi: 1, 2, 3, 4...
decimal-leading-zero Numeri interi con uno 0 posto davanti a ciascun numero: 01, 02, 03, ...
lower-roman Numeri romani in minuscolo: i, ii, iii, iv, v, ...
upper-roman Numeri romani in maiuscolo: I, II, III, IV, V, ...
lower-alpha Lettere dell'alfabeto in minuscolo: a, b, c, d, ...
upper-alpha Lettere dell'alfabeto in maiuscolo: A, B, C, D, ...
lower-latin Come lower-alpha.
upper-latin Come upper-alpha.
lower-greek Lettere dell'alfabeto greco in minuscolo.

 

 

Pagina di Francesco Milanese (redbaron85) su Facebook   Pagina di Francesco Milanese (redbaron85) su Google Plus   Profilo di Francesco Milanese (redbaron85) su LinkedIn   Pagina di Francesco Milanese (redbaron85) su Twitter   Canale Youtube di Francesco Milanese (redbaron85ct)

Vai all'inizio della pagina