HTML 錨點偏移 CSS and JS 兩種方法 (offset anchor tag link)

HTML提供了一個錨點連結的功能 (anchor tag link),換頁或不換頁,都可以把瀏覽器卷軸自動捲到錨點位置,但如果網頁上方有一個黏頭的Header (sticky header),RWD手機版本則習慣使用(sticky header),Header 懸浮本文之上,可能會把錨點的元素內容遮蔽,這時我們則需要偏移(sticky header)的高度,避免錨點元素被遮蔽。[……]

閱讀更多

CSS RWD 響應式斷點 @media 及常用尺寸速查

我常用的方法

這作法雖有違背行動優先的概念,但我實務上遇到比較多還是先做電腦版,再依照電腦版樣式改成手機版本,概念歸概念,能能解決問題的就是好方法,提供大家參考

行動優先-響應式斷點

介紹完我常用的斷點,也介紹一下比較正規的做法,下列這就是行動優先下的響應式斷點,先決定手機版樣式,再針對平板或電腦的樣式進行調整

https://getbootstrap.com/docs/4.3/layout/overview/#responsive-breakpoints

Bootstrap 4 – RWD Layout

這是Bootstrap定義的斷點

https://getbootstrap.com/docs/4.3/layout/overview/#responsive-breakpoints

[……]

閱讀更多