2019-11-26
2019-11-19
2019-11-11
2019-11-01
淺談 BEM CSS - CSS 設計模式與架構
BEM是 Block Element Modifier 的縮寫， BEM 是一種為了讓 CSS Class 更好維護的命名方式，藉由不同組件的命名 讓程式碼易懂、可重用，進而有效率地開發和維護。
2019-10-27
CSS Masks 圖片遮罩效果
上回 CSS 文字鏤空與遮罩效果文章中，介紹了使用 background-clip 對文字進行鏤空或遮罩的效果，此次我們要來介紹另一個 CSS 樣式 mask ，透過 mask 屬性可以針對 PNG 或 SVG 設計遮罩的效果。
2019-10-22
使用 padding-top/bottom 實現等比例響應式背景圖
一般處理響應式圖片時，最簡易的處理方式是將 <img> 圖片標籤寬度設置最大寬度百分比值使其高度會隨著寬度的變化自適應調整，並維持原圖片的寬高比。 若想在一區塊裡添加響應式背景圖，且維持固定的寬高比時，可使用 padding-top 或 padding-bot ...
2019-10-20
2019-10-18
CSS 文字鏤空與遮罩效果
最近看了一部日劇「我要準時下班」，主角東山結衣是在 WEB 製作公司上班的女性，雖然劇中的主軸並非在開發網頁上，但是仍然有不少可以讓前端開發者感同身受的橋段，整體來說算是一部蠻推薦且輕鬆的日劇…
2019-10-17