圓角語法：border-radius：圓角值；
css3圓角的優點
傳統的圓角生成方案，必須使用多張作為背景圖案。css3的出現，使得我們再也不必浪費時間去製作這些了，而且還有其他多個優點：
* 減少維護的工作量。檔案的生成、更新、編寫網頁**，這些工作都不再需要了。
* 提高網頁效能。由於不必再發出多餘的http請求，網頁的載入速度將變快。
* 增加視覺可靠性。某些情況下（網路擁堵、伺服器出錯、網速過慢等等），背景會**失敗，導致視覺效果不佳。css3就不會發生這種情況。
這個值www.cppcns.com可以使用：em ，ex，pt，px，百分比;
border-radius跟margin，padding差不多
border-radius：lefttop，righttop，rightbottom，leftbottom。
複製**
**如下:
.box1
複製**
**如下:
.box2
對於圓角理解起來應該，很簡單。
對於百分比：目前最安全的做法，就是將每個圓角邊框的風格和寬度，都設為一樣的值，並且避免使用百分比值。
ie9以下是不支援此屬性
線性漸變：background:linear-gradient(設定漸變形式,第乙個顏色起點,中間顏色點 中間顏色的位置,結束點顏色);
linear:漸變的型別（線性漸變）；
漸變的形式：可選引數 有兩種方式-1、設定旋轉角度，0度代表水平從左到右，90度就是從上到下啦，從0度開始逆時針變換。
2、使用關鍵字，left代表從左到右，top代表從上到下，同理right就是從右到左，lefttop-從坐上到右下，同理leftbottom，righttop，rightbottom。
中間顏色與中間顏色位置為可選引數。
不過要考慮瀏覽器的相容，咱們這樣寫：
-webkit-gradient（linear,0 0,0 100%,from(起始顏色,to(結束顏色)）； /*for safari4+,chrome 2+*/
-webkit-linear-gradient（起始顏色, 結束顏色）； /*for safari 5.1+,chrome 10+*/
-moz-linear-gradient（起始顏色, 結束顏色）； /*for firefox*/
-o-linear-gradient（起始顏色, 結束顏色）； /*opera*/
linear-gradient（起始顏色, 結束顏色）； /*標準屬性*/
對於ie來說是個麻煩事，老辦法
filter:progid:dximagetransform.microsoft.gradient(startcolorstr=』 起始顏色』,endcolorstr=」 結束顏色」); /*ie6,ie 7*/
-ms-linear-gradient（起始顏色, 結束顏色）； /*ie8*/
複製**
**如下:
.content1
.tit1
重複性線性漸變：repeating-linear-gradient屬性來代替線性漸變linear-gradie程式設計客棧nt；
複製**
**如下:
.content2
徑向漸變：radi程式設計客棧al-gradient（設定漸變的中心，漸變形狀 漸變大小，起始顏色值，中間顏色值 中間顏色位置，終點顏色）
漸變中心，可選引數，如30px 20px指距離左側30px距離上側20px，可以是畫素，可以是百分比，也可以是關鍵字，預設為中心位置。
漸變形狀，可選引數，可以取值circle或eclipse【預設】
漸變大小，可迴圈引數，可以取值
closest-side：
指定徑向漸變的半徑長度為從圓心到離圓心www.cppcns.com最近的邊
closest-corner：
指定徑向漸變的半徑長度為從圓心到離圓心最近的角
farthest-side：
指定徑向漸變的半徑長度為從圓心到離圓心最遠的邊
farthest-corner：
指定徑向漸變的半徑長度為從圓心到離圓心最遠的角
contain：
包含，指定徑向漸變的半徑長度為從圓心到離圓心最近的點。類同於closest-side
cover：
覆蓋，指定徑向漸變的半徑長度為從圓心到離圓心最遠的點。類同於farthest-corner
circle farthest-corner圓形漸變，ellipse farthest-corner橢圓漸變
複製**
**如下:
.content3
本文標題: css3圓角和漸變2種常用功能詳解
本文位址:
CSS3圓角詳解
全屏閱讀 收藏 一 css3圓角的優點 減少維護的工作量。檔案的生成 更新 編寫網頁 這些工作都不再需要了。提高網頁效能。由於不必再發出多餘的http請求，網頁的載入速度將變快。二 border radius屬性 css3圓角只需設定乙個屬性 border radius 含義是 邊框半徑 你為這個屬...
CSS3圓角詳解
css3圓角詳解 日期 2010年12月 9日 css3是樣式表 style sheet 語言的最新版本，它的一大優點就是支援圓角。css3圓角詳解 譯者 阮一峰 原文 發表日期 2010年12月8日 一 css3圓角的優點 減少維護的工作量。檔案的生成 更新 編寫網頁 這些工作都不再需要了。提高網...
關於CSS3圓角
一 css3圓角的優點 減少維護的工作量。檔案的生成 更新 編寫網頁 這些工作都不再需要了。提高網頁效能。由於不必再發出多餘的http請求，網頁的載入速度將變快。二 border radius屬性 css3圓角只需設定乙個屬性 border radius 含義是 邊框半徑 你為這個屬性提供乙個值，就...