[CSS3] – Creare un cerchio colorato

[CSS3] – Creare un cerchio colorato in CSS

Il metodo più rapido e efficace per creare dei cerchi colorati è quello di usare il foglio di stile (CSS3) anziché inserire delle immagini JPG o PNG. Per creare un cerchio colorato dobbiamo semplice scrivere quanto segue:

#cerchio {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background-color: rgb(0,0,200);
}

Per aumentare o diminuire la dimensione del cerchio dobbiamo modificare i valori di Width e Height con lo stesso valore numerico (esempio: width: 20px; height: 20px ….)

Se volessimo creare un cerchio colorato con il bordo, dovremmo aggiungere solo il tag border:

#cerchio {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background-color: rgb(0,200,200);
   border: 1px solid black;
}