中央西門風痕影
好奇
CSS 的
最近遇到一個案子有相鄰的 A、B 兩區塊，其中 A 內部的按鈕被
:has() test - JSFiddle - Code Playground
不過考慮到 Safari 是 15.4（2022-03-14）才支援，最後還是放棄用這個，改用 JS 了
雖然從很久以前就有這感覺，但還是想再說一次：越來越覺得 Safari 是如同 IE 的存在
-
平滑捲動的
:has() 選擇器在去年底被 Firefox 121 支援後，已經被所有的主流瀏覽器支援最近遇到一個案子有相鄰的 A、B 兩區塊，其中 A 內部的按鈕被
:hover 的時候要替換 B 裡的背景，因此想到或許可以用這個處理，像這個樣子：:has() test - JSFiddle - Code Playground
不過考慮到 Safari 是 15.4（2022-03-14）才支援，最後還是放棄用這個，改用 JS 了
雖然從很久以前就有這感覺，但還是想再說一次：越來越覺得 Safari 是如同 IE 的存在
-
平滑捲動的
scroll-behavior 也是類似的狀況
:has() 的 MDN 頁面：
:has() - CSS: Cascading Style Sheets | MDNscroll-behavior 的 MDN 頁面：scroll-behavior - CSS: Cascading Style Sheets | MDN雖然以
:has() 來說，Chrome 跟 Firefox 支援得也滿晚，但他們現在預設都有自動更新的機制，所以比較沒問題
他就現代IE
目前點擊錨點後的平滑捲動，我們多半都用 jQuery 的
這裡的
至於 CSS 的
不過如果遇到那種 header fixed 在畫面頂端的狀況，可能就要想辦法讓錨點往上面偏移，才能捲到正確位置了
而不是像 JS 可以直接在目標值加上偏移量
$('html, body').animate({scrollTop: 0}, 800) 達成這裡的
0 是目標座標，會以該錨點的 offset().top 得出800 則是動畫的整體時間（毫秒）至於 CSS 的
scroll-behavior 則有 auto 與 smooth 可用，動畫時長由瀏覽器或平台自行決定不過如果遇到那種 header fixed 在畫面頂端的狀況，可能就要想辦法讓錨點往上面偏移，才能捲到正確位置了
而不是像 JS 可以直接在目標值加上偏移量
機器狼不太確定呢汪 (っ´ω`c)
safari真的超爛（