CSS繪制圓角矩形圖形的效果

 圓角矩形效果語法border-radius：12px;

 聰明的你，是否已想到了舉一反三的？我們只給某一個角定義圓弧效果？是啦，下面我們來看看其它的一些圓弧效果：

單個角度圓弧果語法 

border-top-left-radius:6px; 

對角圓弧，弧度大小不同的效果語法 

border-top-left-radius:6px;  
border-top-right-radius:12px;

我們對四個角可以同時設(shè)置1到4個值。如果設(shè)置1個值，表示4個圓角都使用這個值。如果設(shè)置兩個值，表示左上角和右下角使用第一個值，右上角和左下角使用第二個值。如果設(shè)置三個值，表示左上角使用第一個值，右上角和左下角使用第二個值，右下角使用第三個值。如果設(shè)置四個值，則依次對應(yīng)左上角、右上角、右下角、左下角（順時針順序）。根據(jù)上述的效果，你是否會腦洞大開，如果我們定義圓，是否可以用這個方法，答案是肯定的。我們在寫圓的代碼時，也是這樣定義的。只需要把 

borde-radius:50%;