7
Come si crea il seguente codice HTML/stile css (angoli arrotondati, base background-color) evidenziato nel riquadro rosso:Come creare lo sfondo css div/angoli arrotondati?
A
risposta
18
Utilizzare la proprietà border-radius CSS per creare bordi arrotondati:
-moz-border-radius: 5px; /* Firefox 3.6-, removed in Firefox 13 */
-webkit-border-radius: 5px; /* Safari 4-, Chrome 3- */
border-radius: 5px; /* Firefox 4+, Safari 5+, Chrome 4+, Opera 10.5+, IE9+ */
Puoi lasciare i prefissi, perché Firefox 3.6 o vecchi browser webkit sono quasi estinti.
Sebbene sia possibile ottenere angoli arrotondati in OldIE (IE8-) utilizzando div + immagini o PIE.htc, vi consiglio di non farlo: PIE non è molto affidabile, e l'aggiunta di diversi hack HTML solo per ottenere qualcosa da lavorare nel vecchio IE è uno spreco.
Vedere anche: MDN: border-radius.
Realisticamente, è necessario solo 'border-radius: 5px'. Le versioni correnti di tutti i browser che supportano 'border-radius' lo supportano senza il prefisso del venditore e lo hanno fatto per un po '. – thirtydot
In FireFox 3.6, che è ancora ampiamente utilizzato, il prefisso '-moz-' è ancora necessario. Molti utenti non hanno l'ultima versione del browser. –
Hai ragione su '-moz-', non ho pensato abbastanza attentamente. – thirtydot