CSS 長度單位:vw、rem

Jane Lin
JL's note
Published in
2 min readFeb 8, 2019
Photo by Greg Rakozy on Unsplash

沒想到逛 LikeCoin 的文章也會挖到 CSS 經驗分享,留下這篇文章做個筆記。

LikeCoin 團隊在設計 LikeButton 時,遇到了在不同螢幕寬度的情況下,無法保持 LikeButton 美觀的問題。有趣的是,他們在 Netflix 網站得到啟發 ─ 使用 vw 單位。不過,這個解法又會造成其他問題,因此又得找其他方法來解決新的問題。

這兩個單位 ─ vwrem 正好目前我都沒用過,也還不熟悉他們的性質,看這篇文章剛好能學習別人的經驗,同時也得到了他們的金句:

遇到問題時,可以看看其他網站偷師,這時一個好習慣,說不定重要關頭可救你一命。

身為前端新手,非常感謝前端的前輩們願意分享經驗和技術,也感謝瀏覽器開發者人員工具的普及和便利性!以下文章有關於 viewpoint 的解說,以及 RWD 的概念,放一起以便參閱。

如果想看更多文章,點擊以下連結可以看到我的文章清單:
* 所有文章清單
如果您喜歡這篇文章,或覺得這篇文章有幫到您,想給我一些支持,可以這麼做:
1. 登入 Liker 點擊下方 LikeButton 免費按讚(按5下),或直接打賞 LikeCoin
2. 透過街口支付請我喝杯咖啡!
3. 拍拍手(1~50下) 給我一些鼓勵。
點擊 LikeButton 可幫助作者得到回饋
透過街口支付小額支持作者

--

--

Jane Lin
JL's note

迷上網頁與程式,學到新東西都會開心好一陣子,想著要怎麼拿去改以前寫過的 code 。