網頁渲染技術整理
SSR SSG CSR ISR DPR
May 13, 20221 min read51
Command Palette
Search for a command to run...
#frontend
Articles tagged with #frontend
CSS 學習筆記 - clamp() 為 HTML 元素設定大小範圍值
格式：clamp(MIN, VAL, MAX)相當於：max(MIN, min(VAL, MAX)) 這幾天在前端社群上看到有人討論字型的大小調整，看到有人介紹到這個 CSS 函數。發現真的很方便，可以提供一小部分來代替 media query 的功能呢。在 Mozilla 的介紹這邊有個 Demo 的小區塊。 例如這個範例：clamp(1.8rem, 2.5vw, 2.8rem)，當發現 2.5vw 算起來小於或大於設定值時，就會以上下限的值來使用。 只有 IE 不支援此 CSS，沒關係 IE...
Apr 20, 20221 min read99HTML5 - 提供原生的 JavaScript DeepCopy 方法 structuredClone
https://html.spec.whatwg.org/multipage/structured-data.html#structured-cloning
Dec 29, 20211 min read17CSS - :has() 一種 "父級" 選擇器
CSS 中的 :has() 是一種可以透過子級元素來限定父級元素的選擇器。一般來說在選擇元素的時候，都是從最上層父級慢慢往下指定：.class1 > .class2 #id。 :has() 則是反過來 /* Matches <a> elements that contain an <img> child */ a:has(img) { … } /* Matches <a> elements that directly contain an <img> child */ a:has(> img)...
Dec 28, 20211 min read39