# Infobox con Bbcode

**URL:** <https://meta.discourse.org/t/bbcode-infoboxes/323332>\
**Category:** Development\
**Tags:** css\
**Created:** [26 Agosto 2024, 12:53am UTC](https://meta.discourse.org/t/bbcode-infoboxes/323332 "2024-08-26T00:53:10Z")\
**Posts on this page:** 1\
**Showing post:** 8

<div class="post-metadata">

**Author:** ![Heliosurge](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heliosurge/32/571810_2.png) [@Heliosurge](https://meta.discourse.org/u/Heliosurge)\
**Post date:** [27 Agosto 2024, 9:30am UTC](https://meta.discourse.org/t/bbcode-infoboxes/323332/8 "2024-08-27T09:30:40Z")

</div>

CSS comune aggiornato

> **Codice**
>
> ```plaintext
> div[data-wrap="redbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #ff0000;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> // background-color: #f5f5f5;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> // background-color: #f5f5f5;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="greenbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #00ff00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="bluebox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;;
> border: 2.75px solid #007bff;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="yellowbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #ffff00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -12px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> v[data-wrap="brownbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #964B00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -12px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="orangebox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #FFA500;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="purplebox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #800080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -12px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="pinkbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #FFC0CB;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -12px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="magentabox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #FF00FF;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="cyanbox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> border: 2.75px solid #00FFFF;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -12px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="box"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;;
> // border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="greybox"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="brownboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #964B00;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="orangeboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FFA5000;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="purpleboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #800080;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5x !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="pinkboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FFC0CB;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="magentaboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FF00FF;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="cyanboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #00FFFF;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="redboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #ff0000;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="greenboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #00ff00;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="blueboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> // background-color: #0000ff;
> background-color: #007bff;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="yellowboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #ffff00;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> v[data-wrap="brownboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #964B00;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="orangeboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FFA5000;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="purpleboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #800080;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="pinkboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FFC0CB;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="magentaboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #FF00FF;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="cyanboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #00FFFF;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="greyboxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #808080;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey1boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #ff0000;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey2boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #00ff00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey3boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #007bff;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey4boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #ffff00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazione    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> 
> // Sfondo grigio aggiungi bordo 
> // colore 4Marrone, 5Arancione,
> // 7Viola, 8Rosa, 9Magenta, Ciano
> 
> div[data-wrap="grey5boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #964B00;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey6boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #FFA500;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey7boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #FFC0CB;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey8boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #FF00FF;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey9boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #FFC0CB;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> div[data-wrap="grey0boxbg"]{
> margin-top: 0.15em;
> margin-bottom: 0.15em;
> padding-left: 0.30em;
> padding-right: 0.30em;
> background-color: #808080;
> border: 2.75px solid #00FFFF;
> border-radius: 0.40em;
> //* Personalizzazioni intestazioni    
> h1 {
> font-family: Georgia, serif;
> font-size: 30px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> h2, h3, h4, h5, h6 {
> font-family: Georgia, serif;
> font-size: 20px;
> font-weight: bold;
> color: darkblue;
> text-align: center;
> margin: 3px 0;
> margin-top: -5px !important;
> margin-bottom: -5px !important;
> padding: 3px;
> background-color: darkgrey;
> border: 2px solid #ccc;
> border-radius: 5px;
> }
> }
> 
> ```

## Novità?

- Aggiunte personalizzazioni da “h1 a h6”. Non è più necessario usare “\>” per evidenziare le intestazioni.
- Spessore del bordo regolato.
- Corretto il grigio aggiunto con bordo rosa.
- Modificato “box” da bordo grigio a nessuno per usarlo come contenitore di box vuoto.
- greybox ha bordo grigio.
- È ancora necessario regolare il colore dell’intestazione per greybg e possibilmente il colore dello sfondo.

 ![Questa è una schermata di un'interfaccia utente, che mostra un'area di input di testo con l'intestazione "Info box". (Didascalia generata dall'IA)](https://global.discourse-cdn.com/meta/original/4X/9/c/2/9c2c65b618ab9d2381ca28ce063d80fec8d915e6.png)

---

_[View the full topic](https://meta.discourse.org/t/bbcode-infoboxes/323332)._