{"id":72,"date":"2011-01-02T00:00:01","date_gmt":"2011-01-02T00:00:01","guid":{"rendered":"http:\/\/imported-1"},"modified":"2011-01-02T00:00:01","modified_gmt":"2011-01-02T00:00:01","slug":"esempi-di-utilizzo-bootstrap","status":"publish","type":"post","link":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/","title":{"rendered":"Esempi di utilizzo Bootstrap"},"content":{"rendered":"<div>&nbsp;<\/div>\n<p><strong>Joomla 3<\/strong> integra il framework <a title=\"bootstrap\" href=\"http:\/\/twitter.github.com\/bootstrap\/\" target=\"_blank\">Bootstrap<\/a> per una veloce e facile implementazione del web design. Inserire icone o testo formattato risulta semplice con i seguenti esempi (Typography) validi su qualsiasi template che supporta Bootstrap e jQuery presenti in Joomla!.<\/p>\n<p>&nbsp;<\/p>\n<div class=\"alert\"><span class=\"icon-warning\"><\/span><button class=\"close\" type=\"button\" data-dismiss=\"alert\">\u00d7<\/button><strong>Attenzione!<\/strong> E&#8217; consigliato disabilitare l&#8217;editor di Joomla! prima di utilizzare queste parti di codice HTML nel contenuto.<\/div>\n<p>&nbsp;<\/p>\n<hr \/>\n<pre class=\"prettyprint\">&lt;p&gt;Esempio di Tooltip sulla parola &lt;abbr title=\"Il nostro caro CMS\"&gt;Joomla&lt;\/abbr&gt;&lt;\/p&gt;<\/pre>\n<p>Esempio di Tooltip sulla parola <abbr title=\"Il nostro caro CMS\">Joomla<\/abbr><\/p>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Blocco formattato<\/p>\n<pre class=\"prettyprint\">&lt;blockquote&gt;<br \/>&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.&lt;\/p&gt;<br \/>&lt;small&gt;Someone famous &lt;cite title=\"Source Title\"&gt;Source Title&lt;\/cite&gt;&lt;\/small&gt;&lt;\/blockquote&gt;<\/pre>\n<blockquote>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.<\/p>\n<p><small>Someone famous <cite title=\"Source Title\">Source Title<\/cite><\/small><\/p><\/blockquote>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Blocco semplice in evidenza<\/p>\n<pre>&lt;pre&gt;Blocco semplice in evidenza&lt;\/pre&gt;<\/pre>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>Immagine con effetto cornice polaroid<\/p>\n<pre class=\"prettyprint\">&lt;img class=\"img-polaroid\" src=\"images\/sampledata\/parks\/animals\/220px_spottedquoll_2005_seanmcclean.jpg\" alt=\"nome immagine\" \/&gt;<\/pre>\n<p><img decoding=\"async\" class=\"img-polaroid\" src=\"\/images\/sampledata\/parks\/animals\/220px_spottedquoll_2005_seanmcclean.jpg\" alt=\"nome immagine\" \/><\/p>\n<hr \/>\n<p>Immagine miniatura che apre la grande<\/p>\n<pre class=\"prettyprint\">&lt;div id=\"myModal2\" class=\"modal hide fade\" style=\" width:auto;\"&gt;<br \/>&lt;div class=\"modal-header\"&gt;&lt;button class=\"close\" type=\"button\" data-dismiss=\"modal\"&gt;\u00d7&lt;\/button&gt;<br \/>&lt;h3 id=\"myModalLabel2\"&gt;Titolo finestra&lt;\/h3&gt;<br \/>&lt;\/div&gt;<br \/>&lt;div class=\"modal-body\"&gt;&lt;img src=\"images\/sampledata\/parks\/landscape\/800px_pinnacles_western_australia.jpg\" alt=\"nome immagine\" \/&gt;&lt;\/div&gt;<br \/>&lt;div class=\"modal-footer\"&gt;&lt;button class=\"btn\" data-dismiss=\"modal\"&gt;Chiudi&lt;\/button&gt;&lt;\/div&gt;<br \/>&lt;\/div&gt;<br \/>&lt;a href=\"#myModal2\" data-toggle=\"modal\"&gt;&lt;img class=\"img-polaroid\" src=\"images\/sampledata\/parks\/landscape\/120px_pinnacles_western_australia.jpg\" alt=\"nome immagine\" \/&gt;&lt;\/a&gt;<\/pre>\n<div id=\"myModal2\" class=\"modal hide fade\" style=\"width: auto;\">\n<div class=\"modal-header\"><button class=\"close\" type=\"button\" data-dismiss=\"modal\">\u00d7<\/button><\/p>\n<h3 id=\"myModalLabel2\">Titolo finestra<\/h3>\n<\/div>\n<div class=\"modal-body\"><img decoding=\"async\" src=\"\/images\/sampledata\/parks\/landscape\/800px_pinnacles_western_australia.jpg\" alt=\"nome immagine\" \/><\/div>\n<div class=\"modal-footer\"><button class=\"btn\" data-dismiss=\"modal\">Chiudi<\/button><\/div>\n<\/div>\n<p><a href=\"\/#myModal2\" data-toggle=\"modal\"><img decoding=\"async\" class=\"img-polaroid\" src=\"\/images\/sampledata\/parks\/landscape\/120px_pinnacles_western_australia.jpg\" alt=\"nome immagine\" \/><\/a><\/p>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>Utilizzare una delle centinaia di icone vettoriali disponibili (<a href=\"\/#icone\">vedi elenco<\/a>)<\/p>\n<pre class=\"prettyprint\">&lt;i class=\"icon-thumbs-up icon-large\"&gt;&lt;\/i&gt;<\/pre>\n<p>&nbsp;<\/p>\n<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">&lt;span style=\"font-size: 50px;\" aria-hidden=\"true\" class=\"icon-picture icon-large\"&gt;&lt;\/span&gt;<\/pre>\n<p>&nbsp;<\/p>\n<\/p>\n<p>&nbsp;<\/p>\n<p>Aumentare a piacere le dimensioni delle icone<\/p>\n<pre class=\"prettyprint\">&lt;div style=\"font-size: 40px;\"&gt;<br \/>&lt;i class=\"icon-zoom-in icon-large\"&gt;&lt;\/i&gt;<br \/>&lt;\/div&gt;<\/pre>\n<div style=\"font-size: 40px;\">&nbsp;<\/div>\n<div style=\"font-size: 40px;\">&nbsp;<\/div>\n<\/p>\n<p>Modificare anche il colore delle icone<\/p>\n<pre class=\"prettyprint\">&lt;div style=\"font-size: 40px; color: #DC143C\"&gt;<br \/>&lt;i class=\"icon-question-sign icon-large\"&gt;&lt;\/i&gt;<br \/>&lt;\/div&gt;<\/pre>\n<div style=\"font-size: 40px; color: #dc143c;\">&nbsp;<\/div>\n<div style=\"font-size: 40px; color: #dc143c;\">&nbsp;<\/div>\n<\/p>\n<p>&nbsp;<\/p>\n<p>Allineare l&#8217;icona grande con il testo normale<\/p>\n<pre class=\"prettyprint\">&lt;i class=\"icon-quote icon-large\" style=\"color: rgb(0, 0, 255); font-size: 60px; margin: 30px 60px 30px 0px; float: left;\"&gt;&lt;\/i&gt; testo....testo...<\/pre>\n<p>In questo esempio l&#8217;icona \u00e8 allineata a sinistra (float: left;) ed ha le dimensioni di valore 60 (font-size: 60px;) ed i valori per i margini sul testo sono i seguenti: 30px 60px 30px 0px <br \/> Risult\u00e0 semplice modificare il valore del colore dell&#8217;icona, la dimensione ed i relativi margini. Nel primo valore dei margini metti la met\u00e0 del valore della dimensione dell&#8217;icona, nel secondo il valore intero e nella terza ancora la met\u00e0 del valore, mentre l&#8217;ultimo valore rimane a zero. <br \/> Questi alcuni esempi di codice colore: GIALLO (255, 255, 0); ROSSO (255, 0, 0); CELESTE (0, 0, 255); VERDE (0, 255, 0); ROSA (255, 0, 255); MARRONE (204, 102, 0); GRIGIO (85, 85, 85);<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">&lt;i class=\"icon-quote-2 icon-large\" style=\"color: rgb(0, 0, 255); font-size: 60px; margin: 30px 60px 30px 0px; float: right;\"&gt;&lt;\/i&gt; testo....testo...<\/pre>\n<p>Mentre questo esempio utilizza lo stesso codice del precedente tranne l&#8217;allineamento dell&#8217;icona che \u00e8 impostato a destra (float: right;) ed ovviamente una differente icona&#8230;&#8230;&#8230;&#8230;&#8230;&#8230;&#8230;&#8230;&#8230;.<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Utilizzare le icone come bottoni<\/p>\n<pre class=\"prettyprint\">&lt;a class=\"btn btn-small\" href=\"#\"&gt;&lt;i class=\"icon-star\"&gt;&lt;\/i&gt;&lt;\/a&gt;<\/pre>\n<p><a class=\"btn btn-small\" href=\"\/\"><em class=\"icon-star\"><\/em><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">    &lt;a href=\"#\" class=\"btn\"&gt;&lt;i class=\"icon-edit\"&gt;&lt;\/i&gt; &lt;strong&gt;Modifica&lt;\/strong&gt;&lt;\/a&gt;<br \/>    &lt;a href=\"#\" class=\"btn\"&gt;&lt;i class=\"icon-trash\"&gt;&lt;\/i&gt; &lt;strong&gt;Cancella&lt;\/strong&gt;&lt;\/a&gt;<br \/>    &lt;a href=\"#\" class=\"btn\"&gt;&lt;i class=\"icon-key\"&gt;&lt;\/i&gt; &lt;strong&gt;Chiave&lt;\/strong&gt;&lt;\/a&gt;<\/pre>\n<p><a class=\"btn\" href=\"\/\"> <strong>Modifica<\/strong><\/a><a class=\"btn\" href=\"\/\"> <strong>Cancella<\/strong><\/a><a class=\"btn\" href=\"\/\"> <strong>Chiave<\/strong><\/a><\/p>\n<p><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Inserire dei tasti<\/p>\n<pre class=\"prettyprint\">&lt;p&gt;&lt;a href=\"#\"  class=\"btn btn-large btn-primary\"&gt;Inizio&lt;\/a&gt;&lt;\/p&gt;<\/pre>\n<p><a class=\"btn btn-large btn-primary\" href=\"\/\">Inizio<\/a><\/p>\n<\/p>\n<p>&nbsp;<\/p>\n<p>Sempre tasti ma di colore e dimensione differenti<\/p>\n<pre class=\"prettyprint\">&lt;a href=\"#\"  class=\"btn\"&gt;Default&lt;\/a&gt;<br \/>&lt;a href=\"#\"  class=\"btn btn-small btn-info\"&gt;Info&lt;\/a&gt;<br \/>&lt;a href=\"#\"  class=\"btn btn-mini btn-success\"&gt;Success&lt;\/a&gt;<br \/>&lt;a href=\"#\"  class=\"btn btn-large btn-warning\"&gt;Warning&lt;\/a&gt;<br \/>&lt;a href=\"#\"  class=\"btn btn-danger\"&gt;Danger&lt;\/a&gt;<br \/>&lt;a href=\"#\"  class=\"btn btn-inverse\"&gt;Inverse&lt;\/a&gt;<\/pre>\n<p><a class=\"btn\" href=\"\/\">Default<\/a><a class=\"btn btn-small btn-info\" href=\"\/\">Info<\/a><a class=\"btn btn-mini btn-success\" href=\"\/\">Success<\/a><a class=\"btn btn-large btn-warning\" href=\"\/\">Warning<\/a><a class=\"btn btn-danger\" href=\"\/\">Danger<\/a><a class=\"btn btn-inverse\" href=\"\/\">Inverse<\/a><\/p>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>Blocco di allerta con bottone di chiusura<\/p>\n<pre class=\"prettyprint\">&lt;div class=\"alert\"&gt;<br \/>    &lt;button type=\"button\" class=\"close\" data-dismiss=\"alert\"&gt;\u00d7&lt;\/button&gt;<br \/>    &lt;strong&gt;Attenzione!&lt;\/strong&gt; Ricordati di disabilitare l'editor prima di utilizzare questi codici nell'HTML del tuo contenuto.<br \/>    &lt;\/div&gt; <\/pre>\n<div class=\"alert\"><button class=\"close\" type=\"button\" data-dismiss=\"alert\">\u00d7<\/button><strong>Attenzione!<\/strong> Ricordati di disabilitare l&#8217;editor prima di utilizzare questi codici nell&#8217;HTML del tuo contenuto.<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">    &lt;div class=\"alert alert-error\"&gt;<br \/>    Blocco errore<br \/>    &lt;\/div&gt;<\/pre>\n<div class=\"alert alert-error\">Blocco errore<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">&lt;div class=\"alert alert-error\"&gt;&lt;span aria-hidden=\"true\" class=\"icon-cancel\"&gt;&lt;\/span&gt;<br \/>Blocco errore con immaginetta...<br \/>&lt;\/div&gt;<\/pre>\n<div class=\"alert alert-error\"><span class=\"icon-cancel\"><\/span> Blocco errore con immaginetta&#8230;<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">    &lt;div class=\"alert alert-success\"&gt;<br \/>    Blocco successo<br \/>    &lt;\/div&gt;<\/pre>\n<div class=\"alert alert-success\">Blocco successo<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\"> &lt;div class=\"alert alert-info\"&gt;<br \/>   Blocco informazioni<br \/>    &lt;\/div&gt;<\/pre>\n<div class=\"alert alert-info\">Blocco informazioni<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<pre class=\"prettyprint\">&lt;div class=\"alert alert-info\"&gt;&lt;span aria-hidden=\"true\" class=\"icon-flag-2 \"&gt;&lt;\/span&gt; Blocco informazioni con immaginetta...<br \/>&lt;\/div&gt;<\/pre>\n<div class=\"alert alert-info\"><span class=\"icon-flag-2 \"><\/span> Blocco informazioni con immaginetta&#8230;<\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>Blocco in evidenza all&#8217;interno di testo con dimensione e float e classe<\/p>\n<pre class=\"prettyprint\">&lt;div class=\"alert alert-error\" style=\" float:left; width:150px; margin: 0 10px;\"&gt;Testo nel blocco...&lt;\/div&gt;Testo artico....<\/pre>\n<div class=\"alert alert-error\" style=\"float: left; width: 150px; margin: 0 10px;\">Blocco semplice in evidenza con dimensione e float<\/div>\n<p>Questo esempio mostra come sia possibile inserire un blocco di testo all&#8217;interno di un paragrafo per evidenziare frasi o altre informazioni.<br \/>E&#8217; possibile agire sulla classe sostituendola con quelle viste in precedenza per cambiare lo sfondo od il colore del carattere. Per modificare le dimensioni del blocco \u00e8 necessario variare il valore della larghezza (width:150px;) mentre per allinearlo a destra \u00e8 necessario cambiare float:left; con float:right;<\/p>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>Esempio di tasto che apre una finestra &#8220;modal&#8221; con all&#8217;interno una immagine<\/p>\n<pre class=\"prettyprint\">&lt;div id=\"myModal\" class=\"modal hide fade\"&gt;<br \/>&lt;div class=\"modal-header\"&gt;&lt;button class=\"close\" type=\"button\" data-dismiss=\"modal\"&gt;\u00d7&lt;\/button&gt;<br \/>&lt;h3 id=\"myModalLabel\"&gt;Titolo finestra&lt;\/h3&gt;<br \/>&lt;\/div&gt;<br \/>&lt;div class=\"modal-body\"&gt;&lt;img class=\"img-polaroid\" src=\"images\/headers\/walden-pond.jpg\" alt=\"nome immagine\" \/&gt;&lt;\/div&gt;<br \/>&lt;div class=\"modal-footer\"&gt;&lt;button class=\"btn\" data-dismiss=\"modal\"&gt;Chiudi&lt;\/button&gt;&lt;\/div&gt;<br \/>&lt;\/div&gt;<br \/>&lt;div class=\"bs-docs-example\" style=\"padding-bottom: 24px;\"&gt;&lt;a class=\"btn btn-primary btn-large\" href=\"#myModal\" data-toggle=\"modal\"&gt;Apri finestra popup&lt;\/a&gt;&lt;\/div&gt;<\/pre>\n<div id=\"myModal\" class=\"modal hide fade\">\n<div class=\"modal-header\"><button class=\"close\" type=\"button\" data-dismiss=\"modal\">\u00d7<\/button><\/p>\n<h3 id=\"myModalLabel\">Titolo finestra<\/h3>\n<\/div>\n<div class=\"modal-body\"><img decoding=\"async\" class=\"img-polaroid\" src=\"\/images\/headers\/walden-pond.jpg\" alt=\"nome immagine\" \/><\/div>\n<div class=\"modal-footer\"><button class=\"btn\" data-dismiss=\"modal\">Chiudi<\/button><\/div>\n<\/div>\n<div class=\"bs-docs-example\" style=\"padding-bottom: 24px;\"><a class=\"btn btn-primary btn-large\" href=\"\/#myModal\" data-toggle=\"modal\">Apri finestra popup<\/a><\/div>\n<p>&nbsp;<\/p>\n<hr \/>\n<p>Esempio slide immagini con effettto Carousel<\/p>\n<pre class=\"prettyprint\">&lt;div id=\"myCarousel\" class=\"carousel slide\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"carousel-inner\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"item active\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;img src=\"images\/headers\/windows.jpg\" alt=\"\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"carousel-caption\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;h4&gt;Prima immagine&lt;\/h4&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;p&gt;Descrizione prima immagine....&lt;\/p&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"item\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;img src=\"images\/headers\/blue-flower.jpg\" alt=\"\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"carousel-caption\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;h4&gt;Seconda immagine&lt;\/h4&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;p&gt;Descrizione seconda immagine...&lt;\/p&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"item\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;img src=\"images\/headers\/walden-pond.jpg\" alt=\"\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=\"carousel-caption\"&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;h4&gt;Terza immagine&lt;\/h4&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;p&gt;Descrizione terza immagine...&lt;\/p&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a class=\"left carousel-control\" href=\"#myCarousel\" data-slide=\"prev\"&gt;&amp;lsaquo;&lt;\/a&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a class=\"right carousel-control\" href=\"#myCarousel\" data-slide=\"next\"&gt;&amp;rsaquo;&lt;\/a&gt;<br \/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;\/div&gt;<\/pre>\n<div id=\"myCarousel\" class=\"carousel slide\">\n<div class=\"carousel-inner\">\n<div class=\"item active\"><img decoding=\"async\" src=\"\/images\/headers\/windows.jpg\" alt=\"\" \/><\/p>\n<div class=\"carousel-caption\">\n<h4>Prima immagine<\/h4>\n<p>Descrizione prima immagine&#8230;.<\/p>\n<\/div>\n<\/div>\n<div class=\"item\"><img decoding=\"async\" src=\"\/images\/headers\/blue-flower.jpg\" alt=\"\" \/><\/p>\n<div class=\"carousel-caption\">\n<h4>Seconda immagine<\/h4>\n<p>Descrizione seconda immagine&#8230;<\/p>\n<\/div>\n<\/div>\n<div class=\"item\"><img decoding=\"async\" src=\"\/images\/headers\/walden-pond.jpg\" alt=\"\" \/><\/p>\n<div class=\"carousel-caption\">\n<h4>Terza immagine<\/h4>\n<p>Descrizione terza immagine&#8230;<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><a class=\"left carousel-control\" href=\"\/#myCarousel\" data-slide=\"prev\">\u2039<\/a><a class=\"right carousel-control\" href=\"\/#myCarousel\" data-slide=\"next\">\u203a<\/a><\/div>\n<hr \/>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<h3><a id=\"icone\"><\/a>Questo l&#8217;elenco delle Icone disponibili in Joomla 3<\/h3>\n<p>&nbsp;<\/p>\n<div class=\"row-fluid\">\n<div class=\"span4\">\n<div class=\"thumbnail\"><span class=\"icon-home\"><\/span> &nbsp;icon-home<\/div>\n<div class=\"thumbnail\"><span class=\"icon-user\"><\/span> &nbsp;icon-user<\/div>\n<div class=\"thumbnail\"><span class=\"icon-locked\"><\/span> &nbsp;icon-locked<\/div>\n<div class=\"thumbnail\"><span class=\"icon-comments\"><\/span> &nbsp;icon-comments<\/div>\n<div class=\"thumbnail\"><span class=\"icon-comments-2\"><\/span> &nbsp;icon-comments-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-out\"><\/span> &nbsp;icon-out<\/div>\n<div class=\"thumbnail\"><span class=\"icon-redo\"><\/span> &nbsp;icon-redo<\/div>\n<div class=\"thumbnail\"><span class=\"icon-undo\"><\/span> &nbsp;icon-undo<\/div>\n<div class=\"thumbnail\"><span class=\"icon-file-add\"><\/span> &nbsp;icon-file-add<\/div>\n<div class=\"thumbnail\"><span class=\"icon-plus\"><\/span> &nbsp;icon-plus<\/div>\n<div class=\"thumbnail\"><span class=\"icon-pencil\"><\/span> &nbsp;icon-pencil<\/div>\n<div class=\"thumbnail\"><span class=\"icon-pencil-2\"><\/span> &nbsp;icon-pencil-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-folder\"><\/span> &nbsp;icon-folder<\/div>\n<div class=\"thumbnail\"><span class=\"icon-folder-2\"><\/span> &nbsp;icon-folder-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-picture\"><\/span> &nbsp;icon-picture<\/div>\n<div class=\"thumbnail\"><span class=\"icon-pictures\"><\/span> &nbsp;icon-pictures<\/div>\n<div class=\"thumbnail\"><span class=\"icon-list-view\"><\/span> &nbsp;icon-list-view<\/div>\n<div class=\"thumbnail\"><span class=\"icon-power-cord\"><\/span> &nbsp;icon-power-cord<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cube\"><\/span> &nbsp;icon-cube<\/div>\n<div class=\"thumbnail\"><span class=\"icon-puzzle\"><\/span> &nbsp;icon-puzzle<\/div>\n<div class=\"thumbnail\"><span class=\"icon-flag\"><\/span> &nbsp;icon-flag<\/div>\n<div class=\"thumbnail\"><span class=\"icon-tools\"><\/span> &nbsp;icon-tools<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cogs\"><\/span> &nbsp;icon-cogs<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cog\"><\/span> &nbsp;icon-cog<\/div>\n<div class=\"thumbnail\"><span class=\"icon-equalizer\"><\/span> &nbsp;icon-equalizer<\/div>\n<div class=\"thumbnail\"><span class=\"icon-wrench\"><\/span> &nbsp;icon-wrench<\/div>\n<div class=\"thumbnail\"><span class=\"icon-brush\"><\/span> &nbsp;icon-brush<\/div>\n<div class=\"thumbnail\"><span class=\"icon-eye\"><\/span> &nbsp;icon-eye<\/div>\n<div class=\"thumbnail\"><span class=\"icon-checkbox-unchecked\"><\/span> &nbsp;icon-checkbox-unchecked<\/div>\n<div class=\"thumbnail\"><span class=\"icon-checkbox\"><\/span> &nbsp;icon-checkbox<\/div>\n<div class=\"thumbnail\"><span class=\"icon-checkbox-partial\"><\/span> &nbsp;icon-checkbox-partial<\/div>\n<div class=\"thumbnail\"><span class=\"icon-star\"><\/span> &nbsp;icon-star<\/div>\n<div class=\"thumbnail\"><span class=\"icon-star-2\"><\/span> &nbsp;icon-star-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-star-empty\"><\/span> &nbsp;icon-star-empty<\/div>\n<div class=\"thumbnail\"><span class=\"icon-calendar\"><\/span> &nbsp;icon-calendar<\/div>\n<div class=\"thumbnail\"><span class=\"icon-calendar-2\"><\/span> &nbsp;icon-calendar-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-help\"><\/span> &nbsp;icon-help<\/div>\n<div class=\"thumbnail\"><span class=\"icon-support\"><\/span> &nbsp;icon-support<\/div>\n<div class=\"thumbnail\"><span class=\"icon-warning\"><\/span> &nbsp;icon-warning<\/div>\n<div class=\"thumbnail\"><span class=\"icon-checkmark\"><\/span> &nbsp;icon-checkmark<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cancel\"><\/span> &nbsp;icon-cancel<\/div>\n<div class=\"thumbnail\"><span class=\"icon-minus\"><\/span> &nbsp;icon-minus<\/div>\n<div class=\"thumbnail\"><span class=\"icon-remove\"><\/span> &nbsp;icon-remove<\/div>\n<\/div>\n<div class=\"span4\">\n<div class=\"thumbnail\"><span class=\"icon-mail\"><\/span> &nbsp;icon-mail<\/div>\n<div class=\"thumbnail\"><span class=\"icon-mail-2\"><\/span> &nbsp;icon-mail-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-drawer\"><\/span> &nbsp;icon-drawer<\/div>\n<div class=\"thumbnail\"><span class=\"icon-drawer-2\"><\/span> &nbsp;icon-drawer-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-box-add\"><\/span> &nbsp;icon-box-add<\/div>\n<div class=\"thumbnail\"><span class=\"icon-box-remove\"><\/span> &nbsp;icon-box-remove<\/div>\n<div class=\"thumbnail\"><span class=\"icon-search\"><\/span> &nbsp;icon-search<\/div>\n<div class=\"thumbnail\"><span class=\"icon-filter\"><\/span> &nbsp;icon-filter<\/div>\n<div class=\"thumbnail\"><span class=\"icon-camera\"><\/span> &nbsp;icon-camera<\/div>\n<div class=\"thumbnail\"><span class=\"icon-play\"><\/span> &nbsp;icon-play<\/div>\n<div class=\"thumbnail\"><span class=\"icon-music\"><\/span> &nbsp;icon-music<\/div>\n<div class=\"thumbnail\"><span class=\"icon-grid-view\"><\/span> &nbsp;icon-grid-view<\/div>\n<div class=\"thumbnail\"><span class=\"icon-grid-view-2\"><\/span> &nbsp;icon-grid-view-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-menu\"><\/span> &nbsp;icon-menu<\/div>\n<div class=\"thumbnail\"><span class=\"icon-thumbs-up\"><\/span> &nbsp;icon-thumbs-up<\/div>\n<div class=\"thumbnail\"><span class=\"icon-thumbs-down\"><\/span> &nbsp;icon-thumbs-down<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cancel-2\"><\/span> &nbsp;icon-cancel-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-plus-2\"><\/span> &nbsp;icon-plus-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-minus-2\"><\/span> &nbsp;icon-minus-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-key\"><\/span> &nbsp;icon-key<\/div>\n<div class=\"thumbnail\"><span class=\"icon-quote\"><\/span> &nbsp;icon-quote<\/div>\n<div class=\"thumbnail\"><span class=\"icon-quote-2\"><\/span> &nbsp;icon-quote-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-database\"><\/span> &nbsp;icon-database<\/div>\n<div class=\"thumbnail\"><span class=\"icon-location\"><\/span> &nbsp;icon-location<\/div>\n<div class=\"thumbnail\"><span class=\"icon-zoom-in\"><\/span> &nbsp;icon-zoom-in<\/div>\n<div class=\"thumbnail\"><span class=\"icon-zoom-out\"><\/span> &nbsp;icon-zoom-out<\/div>\n<div class=\"thumbnail\"><span class=\"icon-expand\"><\/span> &nbsp;icon-expand<\/div>\n<div class=\"thumbnail\"><span class=\"icon-contract\"><\/span> &nbsp;icon-contract<\/div>\n<div class=\"thumbnail\"><span class=\"icon-expand-2\"><\/span> &nbsp;icon-expand-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-contract-2\"><\/span> &nbsp;icon-contract-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-health\"><\/span> &nbsp;icon-health<\/div>\n<div class=\"thumbnail\"><span class=\"icon-wand\"><\/span> &nbsp;icon-wand<\/div>\n<div class=\"thumbnail\"><span class=\"icon-refresh\"><\/span> &nbsp;icon-refresh<\/div>\n<div class=\"thumbnail\"><span class=\"icon-vcard\"><\/span> &nbsp;icon-vcard<\/div>\n<div class=\"thumbnail\"><span class=\"icon-clock\"><\/span> &nbsp;icon-clock<\/div>\n<div class=\"thumbnail\"><span class=\"icon-compass\"><\/span> &nbsp;icon-compass<\/div>\n<div class=\"thumbnail\"><span class=\"icon-address\"><\/span> &nbsp;icon-address<\/div>\n<div class=\"thumbnail\"><span class=\"icon-feed\"><\/span> &nbsp;icon-feed<\/div>\n<div class=\"thumbnail\"><span class=\"icon-flag-2\"><\/span> &nbsp;icon-flag-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-pin\"><\/span> &nbsp;icon-pin<\/div>\n<div class=\"thumbnail\"><span class=\"icon-lamp\"><\/span> &nbsp;icon-lamp<\/div>\n<div class=\"thumbnail\"><span class=\"icon-chart\"><\/span> &nbsp;icon-chart<\/div>\n<div class=\"thumbnail\"><span class=\"icon-bars\"><\/span> &nbsp;icon-bars<\/div>\n<div class=\"thumbnail\"><span class=\"icon-pie\"><\/span> &nbsp;icon-pie<\/div>\n<\/div>\n<div class=\"span4\">\n<div class=\"thumbnail\"><span class=\"icon-dashboard\"><\/span> &nbsp;icon-dashboard<\/div>\n<div class=\"thumbnail\"><span class=\"icon-lightning\"><\/span> &nbsp;icon-lightning<\/div>\n<div class=\"thumbnail\"><span class=\"icon-move\"><\/span> &nbsp;icon-move<\/div>\n<div class=\"thumbnail\"><span class=\"icon-next\"><\/span> &nbsp;icon-next<\/div>\n<div class=\"thumbnail\"><span class=\"icon-previous\"><\/span> &nbsp;icon-previous<\/div>\n<div class=\"thumbnail\"><span class=\"icon-first\"><\/span> &nbsp;icon-first<\/div>\n<div class=\"thumbnail\"><span class=\"icon-last\"><\/span> &nbsp;icon-last<\/div>\n<div class=\"thumbnail\"><span class=\"icon-loop\"><\/span> &nbsp;icon-loop<\/div>\n<div class=\"thumbnail\"><span class=\"icon-shuffle\"><\/span> &nbsp;icon-shuffle<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-first\"><\/span> &nbsp;icon-arrow-first<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-last\"><\/span> &nbsp;icon-arrow-last<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-up\"><\/span> &nbsp;icon-arrow-up<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-right\"><\/span> &nbsp;icon-arrow-right<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-down\"><\/span> &nbsp;icon-arrow-down<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-left\"><\/span> &nbsp;icon-arrow-left<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-up-2\"><\/span> &nbsp;icon-arrow-up-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-right-2\"><\/span> &nbsp;icon-arrow-right-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-down-2\"><\/span> &nbsp;icon-arrow-down-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-left-2\"><\/span> &nbsp;icon-arrow-left-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-play-2\"><\/span> &nbsp;icon-play-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-menu-2\"><\/span> &nbsp;icon-menu-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-up-3\"><\/span> &nbsp;icon-arrow-up-3<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-right-3\"><\/span> &nbsp;icon-arrow-right-3<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-down-3\"><\/span> &nbsp;icon-arrow-down-3<\/div>\n<div class=\"thumbnail\"><span class=\"icon-arrow-left-3\"><\/span> &nbsp;icon-arrow-left-3<\/div>\n<div class=\"thumbnail\"><span class=\"icon-printer\"><\/span> &nbsp;icon-printer<\/div>\n<div class=\"thumbnail\"><span class=\"icon-color-palette\"><\/span> &nbsp;icon-color-palette<\/div>\n<div class=\"thumbnail\"><span class=\"icon-camera-2\"><\/span> &nbsp;icon-camera-2<\/div>\n<div class=\"thumbnail\"><span class=\"icon-file\"><\/span> &nbsp;icon-file<\/div>\n<div class=\"thumbnail\"><span class=\"icon-file-remove\"><\/span> &nbsp;icon-file-remove<\/div>\n<div class=\"thumbnail\"><span class=\"icon-copy\"><\/span> &nbsp;icon-copy<\/div>\n<div class=\"thumbnail\"><span class=\"icon-cart\"><\/span> &nbsp;icon-cart<\/div>\n<div class=\"thumbnail\"><span class=\"icon-basket\"><\/span> &nbsp;icon-basket<\/div>\n<div class=\"thumbnail\"><span class=\"icon-broadcast\"><\/span> &nbsp;icon-broadcast<\/div>\n<div class=\"thumbnail\"><span class=\"icon-screen\"><\/span> &nbsp;icon-screen<\/div>\n<div class=\"thumbnail\"><span class=\"icon-tablet\"><\/span> &nbsp;icon-tablet<\/div>\n<div class=\"thumbnail\"><span class=\"icon-mobile\"><\/span> &nbsp;icon-mobile<\/div>\n<div class=\"thumbnail\"><span class=\"icon-users\"><\/span> &nbsp;icon-users<\/div>\n<div class=\"thumbnail\"><span class=\"icon-briefcase\"><\/span> &nbsp;icon-briefcase<\/div>\n<div class=\"thumbnail\"><span class=\"icon-download\"><\/span> &nbsp;icon-download<\/div>\n<div class=\"thumbnail\"><span class=\"icon-upload\"><\/span> &nbsp;icon-upload<\/div>\n<div class=\"thumbnail\"><span class=\"icon-bookmark\"><\/span> &nbsp;icon-bookmark<\/div>\n<div class=\"thumbnail\"><span class=\"icon-out-2\"><\/span> &nbsp;icon-out-2<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Joomla 3 integra il framework Bootstrap per una veloce e facile implementazione del web design. Inserire icone o testo formattato risulta semplice con i seguenti esempi (Typography) validi su [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_EventAllDay":false,"_EventTimezone":"","_EventStartDate":"","_EventEndDate":"","_EventStartDateUTC":"","_EventEndDateUTC":"","_EventShowMap":false,"_EventShowMapLink":false,"_EventURL":"","_EventCost":"","_EventCostDescription":"","_EventCurrencySymbol":"","_EventCurrencyCode":"","_EventCurrencyPosition":"","_EventDateTimeSeparator":"","_EventTimeRangeSeparator":"","_EventOrganizerID":[],"_EventVenueID":[],"_OrganizerEmail":"","_OrganizerPhone":"","_OrganizerWebsite":"","_VenueAddress":"","_VenueCity":"","_VenueCountry":"","_VenueProvince":"","_VenueState":"","_VenueZip":"","_VenuePhone":"","_VenueURL":"","_VenueStateProvince":"","_VenueLat":"","_VenueLng":"","_VenueShowMap":false,"_VenueShowMapLink":false,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-72","post","type-post","status-publish","format-standard","hentry","category-blog"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Esempi di utilizzo Bootstrap - PugliaSOS2.0<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Esempi di utilizzo Bootstrap - PugliaSOS2.0\" \/>\n<meta property=\"og:description\" content=\"&nbsp; Joomla 3 integra il framework Bootstrap per una veloce e facile implementazione del web design. Inserire icone o testo formattato risulta semplice con i seguenti esempi (Typography) validi su [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/\" \/>\n<meta property=\"og:site_name\" content=\"PugliaSOS2.0\" \/>\n<meta property=\"article:published_time\" content=\"2011-01-02T00:00:01+00:00\" \/>\n<meta name=\"author\" content=\"PugliaSOS\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"PugliaSOS\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/#article\",\"isPartOf\":{\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/\"},\"author\":{\"name\":\"PugliaSOS\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/#\\\/schema\\\/person\\\/1e219b3d8de394c7d6969b52c116f336\"},\"headline\":\"Esempi di utilizzo Bootstrap\",\"datePublished\":\"2011-01-02T00:00:01+00:00\",\"mainEntityOfPage\":{\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/\"},\"wordCount\":762,\"articleSection\":[\"Blog\"],\"inLanguage\":\"it-IT\"},{\"@type\":\"WebPage\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/\",\"url\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/\",\"name\":\"Esempi di utilizzo Bootstrap - PugliaSOS2.0\",\"isPartOf\":{\"@id\":\"http:\\\/\\\/130.110.14.181\\\/#website\"},\"datePublished\":\"2011-01-02T00:00:01+00:00\",\"author\":{\"@id\":\"http:\\\/\\\/130.110.14.181\\\/#\\\/schema\\\/person\\\/1e219b3d8de394c7d6969b52c116f336\"},\"breadcrumb\":{\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/2011\\\/01\\\/02\\\/esempi-di-utilizzo-bootstrap\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"http:\\\/\\\/130.110.14.181\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Esempi di utilizzo Bootstrap\"}]},{\"@type\":\"WebSite\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/#website\",\"url\":\"http:\\\/\\\/130.110.14.181\\\/\",\"name\":\"PugliaSOS2.0\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\\\/\\\/130.110.14.181\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Person\",\"@id\":\"http:\\\/\\\/130.110.14.181\\\/#\\\/schema\\\/person\\\/1e219b3d8de394c7d6969b52c116f336\",\"name\":\"PugliaSOS\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g\",\"caption\":\"PugliaSOS\"},\"url\":\"http:\\\/\\\/130.110.14.181\\\/index.php\\\/author\\\/pugliasos\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Esempi di utilizzo Bootstrap - PugliaSOS2.0","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/","og_locale":"it_IT","og_type":"article","og_title":"Esempi di utilizzo Bootstrap - PugliaSOS2.0","og_description":"&nbsp; Joomla 3 integra il framework Bootstrap per una veloce e facile implementazione del web design. Inserire icone o testo formattato risulta semplice con i seguenti esempi (Typography) validi su [&hellip;]","og_url":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/","og_site_name":"PugliaSOS2.0","article_published_time":"2011-01-02T00:00:01+00:00","author":"PugliaSOS","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"PugliaSOS","Tempo di lettura stimato":"10 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/#article","isPartOf":{"@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/"},"author":{"name":"PugliaSOS","@id":"http:\/\/130.110.14.181\/#\/schema\/person\/1e219b3d8de394c7d6969b52c116f336"},"headline":"Esempi di utilizzo Bootstrap","datePublished":"2011-01-02T00:00:01+00:00","mainEntityOfPage":{"@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/"},"wordCount":762,"articleSection":["Blog"],"inLanguage":"it-IT"},{"@type":"WebPage","@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/","url":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/","name":"Esempi di utilizzo Bootstrap - PugliaSOS2.0","isPartOf":{"@id":"http:\/\/130.110.14.181\/#website"},"datePublished":"2011-01-02T00:00:01+00:00","author":{"@id":"http:\/\/130.110.14.181\/#\/schema\/person\/1e219b3d8de394c7d6969b52c116f336"},"breadcrumb":{"@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/130.110.14.181\/index.php\/2011\/01\/02\/esempi-di-utilizzo-bootstrap\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/130.110.14.181\/"},{"@type":"ListItem","position":2,"name":"Esempi di utilizzo Bootstrap"}]},{"@type":"WebSite","@id":"http:\/\/130.110.14.181\/#website","url":"http:\/\/130.110.14.181\/","name":"PugliaSOS2.0","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/130.110.14.181\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Person","@id":"http:\/\/130.110.14.181\/#\/schema\/person\/1e219b3d8de394c7d6969b52c116f336","name":"PugliaSOS","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/secure.gravatar.com\/avatar\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0f3d85b8e8409fc2c484f438be7de4caf93659f326adbb248e8a1ac5c2e16fd6?s=96&d=mm&r=g","caption":"PugliaSOS"},"url":"http:\/\/130.110.14.181\/index.php\/author\/pugliasos\/"}]}},"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/posts\/72","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/comments?post=72"}],"version-history":[{"count":0,"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/posts\/72\/revisions"}],"wp:attachment":[{"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/media?parent=72"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/categories?post=72"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/130.110.14.181\/index.php\/wp-json\/wp\/v2\/tags?post=72"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}