圓角動畫就是手機開啟應用的APP圖示由圓角過度，逐漸變大舒展到鋪滿整個螢幕，這個叫做圓角動畫。不是非線性動畫。

圓角動畫就是手機開啟應用的APP圖示由圓角過度，逐漸變大舒展到鋪滿整個螢幕，這個叫做圓角動畫。不是非線性動畫。

先來回答一下圓角

圓角是用一段與角的兩邊相切的圓弧替換原來的角，圓角的大小用圓弧的半徑表示。在網頁設計越來越精美的今天，圓角的應用已經越來越廣泛。

中文名

圓角

外文名

Fillet

釋義

一段與角的兩邊相切的圓弧

表示方式

用圓弧的半徑表示

應用

網頁設計

建立方法

CSS3，CSS3+圖片等

定義

圓角是用一段與角的兩邊相切的圓弧替換原來的角，圓角的大小用圓弧的半徑表示。[1]

建立圓角的方法

CSS3

隨著HTML5/CSS3的到來，CSS3樣式的圓角必將成為構建未來網站的趨勢。CSS3相對於其它方式，更加容易應用，不需要額外的HTML標記和圖片。目前支援CSS3圓角的瀏覽器包括FireFox,Chrome,Opera,IE9等；由於目前中文使用者多使用IE，並且多為IE6-IE8，因此，CSS3的普及尚需時日。[2]

CSS+圖片

CSS2圓角一般需要額外的HTML標記和圖片，然而其優點也是非常明顯的：支援所有主流瀏覽器，包括IE(6-9),FireFox,Chrome,Opera等。

純CSS

純CSS圓角，不需要圖片，因此，網站載入速度更快，然而需要額外的HTML標記，並且效果也沒有帶圖片的圓角精美。[3]

JavaScript

JavaScript圓角不需要額外的HTML標記和圖片，有現成的程式碼，一勞永逸。然而對於病毒氾濫的今天，很多使用者會禁用JavaScript，對於使用者體驗至上的網站，如果使用者關閉掉JavaScript，自己所有的一切努力也就白費了。[4]

圓角專利

蘋果此前獲得的諸多關於 iPhone 和 iPad 的專利中或多或少都會包含一些實際的功能，比如 Home 鍵、背面輪廓設計或者前面板整體玻璃覆蓋設計等。但此次獲得的專利卻單單描述了一個裝置的外觀設計，矩形圓角。這項專利的適用場景真的太廣了，當然你可以說專利圖中的畫像將這項專利限制在特定長寬比的裝置中，這樣有著其他尺寸和比例的平板還是可以不侵權的。

圓角生成軟體

Rounded Corner

Rounded Corner支援多種樣式的圓角生成，可以生成標準圓角，帶邊框的圓角，帶漸變色的圓角，並且可以整合CSS Sprite技術，從而加快網站載入速度，提高使用者體驗。

該工具支援中文。

純CSS圓角生成器

SpiffyCorners可可以建立純CSS格式的程式碼，目前不支援中文。

JQuery Corner

JQuery Rounded Corner作為JQuery的外掛，是應用最廣的JavaScript圓角外掛。