CSS 之什麼時候該設定成相對單位

寫 RWD 最難搞的就是單位了。

個人建議

我覺得新手在對 RWD 不太熟的時候常會分不清楚什麼時候該使用「相對單位」,什麼時候該用「絕對單位」,所以以下是我的一些建議:

  • 會隨著寬度來做改變的區塊,應該要將其 width 設為 %

  • 文字或區塊之間的 marginpadding 則要視情況,如果設為 %,則當寬度越大的時候,文字或區塊之間的間距也會跟著逐漸變大,所以這部分要自己斟酌。

  • 有些區塊的 padding。如果四個邊都有設 padding,那就要考慮到,當寬度越寬的時候,這個區塊的內容就會越往裡面推,所以要考慮內容本身會不會隨著寬度增加而變大?如果不會,那差距就隨著寬度會越來越大。

  • 如果希望一個區塊的width height會隨著視窗增加的時候,或許就需要設 %。

讓網頁變得更潮,prefers-color-scheme CSS 之 margin 負值的內涵
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×