Titoli
Qui di seguito sono visualizzati i cinque livelli di titoli disponibili. Il titolo di primo livello, h1, è gestito automaticamente dal sistema nel campo "titolo" presente in ogni pagina.
Titolo di secondo livello (h2)
Titolo di terzo livello (h3)
Titolo di quarto livello (h4)
Titolo di quinto livello (h5)
Titolo di sesto livello (h6)
Titolo di secondo livello (h2)
Titolo di terzo livello (h3)
Titolo di quarto livello (h4)
Titolo di quinto livello (h5)
Titolo di sesto livello (h6)
Titoli con paragrafi
Ecco alcuni esempi di titoli intervallati da paragrafi e da altri elementi
Titolo di secondo livello (h2)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Titolo di terzo livello (h3)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Titolo di quarto livello (h4)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Titolo di quinto livello (h5)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Titolo di sesto livello (h6)
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.
Elenchi puntati e numerati
Esempio di elenco puntato
- Elemento uno
- Elemento due
- Elemento tre
- Elemento quattro
Esempio di elenco numerato
- Elemento uno
- Elemento due
- Elemento tre
- Elemento quattro
Suddivisione in colonne del contenuto della pagina
Spiegazione dei tag:
- Il tag «cols-wrapper» serve per racchiudere una riga composta da più colonne. Il margine superiore e quello inferiore della riga di colonne è allineato.
- Per creare le colonne si usa il tag «col» che accetta come parametro la frazione per la colonna con l'attributo «width» che può assumere i seguenti valori: 1-5 (1/5), 1-4 (1/4), 1-3 (1/3), 1-2 (1/2), 2-3 (2/3), 3-4 (3/4), 2-5 (2/5), 3-5 (3/5), 4-5 (4/5). Ad esempio si può creare una colonna larga 1/4 di pagina ed una colonna a fianco larga 3/4. L'ultima colonna (quella più a destra) dovrà avere anche il parametro «last=1».
Esempio due colonne uguali (1/2 + 1/2)
Contenuto della prima colonna
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
Contenuto della seconda colonna
Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.
Esempio con prima colonna 1/4 e seconda colonna a 3/4
Contenuto della prima colonna
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
Contenuto della seconda colonna
Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.
Casella con icona e testo
Nel contenuto possono essere inseriti dei box composti da una icona ed un testo come ad esempio un titolo o un titolo più un paragrafetto. Il titolo o il contenuto possono avere un link.
Esempio con solo un titolo:
Esempio con titolo più testo:
Titolo del box
Sotto al titolo si può mettere anche un breve testo che sarà allineato a sinistra con il titolo.
Area con sfondo scuro
All'interno del contenuto di una pagina si può usare il tag speciale «box-colorbg» per creare un riquadro con colore di sfondo scuro e testo chiaro. Esempio:
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis
Area con sfondo chiaro
All'interno del contenuto di una pagina si può usare il tag speciale «box-colorbg» per creare un riquadro con colore di sfondo chiaro e testo scuro. Esempio:
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis
Combinazioni di tag
Tutti i tag descritti fino ad ora possono essere combinati tra di loro, ad esempio si possono creare delle colonne che contengono dei box con icone o caselle scure:
Esempio box con icone e testi
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Titolo del box
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.