• Come smussare gli angoli di un elemento DIV con CSS 3.0

    by  • 28 marzo 2011 • CSS, HTML, Web Design • 0 Comments

    Utilizzando CSS3, è possibile ottenere un riquadro con gli angoli arrotondati, con raggio a piacimento, il codice proposto funziona correttamente con le versioni di browser elencate di seguito:

     

    • Firefox 3.5 e successive
    • Internet Explorer 9
    • Safari 3.0 e successive
    • Opera 10.5 e successive
    • Google Chrome 4.1 e successive

    Ma andiamo subito a vedere il codice:

    Definiamo una nuova class CSS

    .rounded {
       border:solid 5px #191919;
       -moz-border-radius:15px;
       -webkit-border-radius:15px;
       border-radius:15px;
    }

    e applichiamola ad un elemento DIV in questa maniera:

     
     
    <div class="rounded" style="width: 400px; height: 200px; text-align: center;">
       Questa è una prova</div>
     
     

    per ottenere questo risultato:

    Lascia un commento

    Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *