css:px和%區別在哪？

開發工具與關鍵技術：工具:DW 關鍵技術:js、css   
作者：鄭海輝
撰寫時間：2019年1月16日

我們在寫樣式時，通常都是要給div設置高度和寬度又或者是一些圓角的效果的，在一個大的div裏，給小的div設置寬度和高度，有的人喜歡直接給它設置多少px（像素單位），也有人喜歡直接給小的一個百分比，一般情況下，用px又或者是%是沒有什麼區別的，都能實現相同的高度和寬度。


那有沒有px實現%卻實現不了的效果呢？
有。
當你想要把長方形的div做成橢圓的時候，只能用百分比去實現，無法用px去實現。
請看下圖


用px的設置圓角效果最大隻能設置到高度的一半，也就是我所給的100px的一半，50px，設置出來就是A-X那樣子。並不是一個橢圓。
而B-X我是直接給了它一個百分之五十的效果，也已經是最大效果了。它設置出來的效果就是一個橢圓。
那正方形做圓呢？其實正方形做圓的話是兩個寫法都可以實現的，因爲高度和寬度都是相等的，便不會出現A-X那樣的情況。