codice sorgente 

 Per visualizzare nello specifico le situazioni gestite con le classi clicca qui

Style e Class

Esempio di testo con attributo "Color": <span style="color:#33bad7;"> 

Esempio di testo con attributo "Class": <span class="Accent"> 

Bordo con Padding

Esempio di div con bordo e padding: style="border: 1px solid rgb(204, 204, 204);

Oppure:

Vuoi massima libertà? Compra ora e vieni al parco quando vuoi:  Acquista un biglietto a data libera

 

Padding e margin negativo

  l'ordine dei valori di padding e margin è: superiore / destro / inferiore /sinistro

Esempio di paragrafo con padding style="padding: 50px 100px 50px 0px;"

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

 

Esempio di paragrafo con margin negativo style="margin-bottom: -50px"

 

Made Web

 

Un prodotto Made Suite di Matematici

 

Esempio di paragrafo con margin negativo style="margin: 70px 70px -50px -30px"

Made Web

 

Un prodotto Made Suite di Matematici

 

Testo con background padding e margin

    Esempio di testo con BG colorato

<span style="color:#ffffff;
    background-color:#000000;
    padding: 5px 10px 5px 10px;
    margin: 5px;
    display: inline-block;">Concerti</span>

Concerti Spettacoli Teatrali Parchi Tematici Mostre Fiere Musei Eventi Manifestazioni Sportive

Segnalibro

Esempio di segnalibro sulla stessa pagina

Attiva lo scroll su una porzione di testo all'interno della stessa pagina

Per spostarci ad un punto preciso della stessa pagina usiamo un codice del tipo: "<a href="#step1>...</a>" per lanciare la chiamata e poi "<p id="step1">...</p>" per mettere il segnalibro

vai allo step 1

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

vai allo step 2

Step 1

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

 

Step 2

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

 

Esempio di segnalibro su una pagina diversa

Attiva lo scroll su una porzione di testo situato su una pagina diversa da quella di lancio

Per spostarci ad un punto preciso di una pagina esterna usiamo un codice del tipo: "<a href="https://madeticket.it/it/utility/creazione-pagina#test-link" >...</a> per lanciare la chiamata e poi <p id="test-link">...</p> per mettere il segnalibro

 

Gestione colori

Colore Punti elenco

Esempio: <ul style="--color-list: #ff9c00">

  • Lorem ipsum 
  • Dolor sit

 

Colore fascia raggruppamento

Esempio: <h2 class="Raggruppamento" style="background-color: #ff9c00;">

Soluzioni su misura

Colore hr

Esempio: <hr style="border-top-color: #ff9c00" />