![[筆記] 原生 HTML Select 選項下拉符號 CSS](https://smlpoints.com/wp-content/uploads/css-ul-li-align-center-1.jpg "[筆記] 原生 HTML Select 選項下拉符號 CSS")
[筆記] 原生 HTML Select 選項下拉符號 CSS
若要穩定的在多個瀏覽器上實現下拉選單框的最右側有一個 V 的符號，可以參考一下 Stack Overflow 上的一組經典範例。 內容 1. appearanc Read More …
標籤: CSS
[筆記] CSS Grid 的 items-stretch 實現卡片等高佈局
網頁排版中如何實現「卡片等高」是一個相當常見的需求。由於後端所給的資料內容長短不一，加上也有可能因為字體而導致換行 … 等因素，直接寫死高度並不是個 Read More …
[筆記] 用 media query 來撰寫僅支援 hover 的樣式
CSS 的 Media Query 可用於判別 hover 的裝置，進而做出樣式效果。由於手機等行動裝置會模擬 hover 效果，需要額外點擊其他地方在能將 h Read More …
![[筆記] Tailwind CSS Safelist 設定](https://smlpoints.com/wp-content/uploads/notes-tailwind-css-3-set-developing-environment.png "[筆記] Tailwind CSS Safelist 設定")
[筆記] Tailwind CSS Safelist 設定
這邊筆記下若用 Vue3 搭配 TailwindCSS 使用時，若用動態傳值來指定的 class – 像是顏色代碼，那你會發現沒有作用。因為 Tai Read More …
[筆記] 純 CSS Blur 創造模糊效果
近期在製作模糊效果時，想說在 2024 的現在可否使用純 CSS 來製作，不用使用 svg。透過 caniuse 的相容性統計，iOS Safari, Goog Read More …
![[指南] 既存 JavaScript + HTML + CSS 原生頁面打造新功能的一些心法](https://smlpoints.com/wp-content/uploads/notes-zh-tw-en-javascript-understanding-the-weird-part-1.jpg "[指南] 既存 JavaScript + HTML + CSS 原生頁面打造新功能的一些心法")
[指南] 既存 JavaScript + HTML + CSS 原生頁面打造新功能的一些心法
這回為了要在短時間內，於既有的義大利醬料式的網站上，加上一個新功能。看見其複雜且耦合度極高的 CSS, JS 和 HTML 檔案，實在難以下手。這邊筆記下一些經 Read More …
![[筆記] Nuxt 關於 SCSS 的引入寫法注意事項](https://smlpoints.com/wp-content/uploads/notes-nuxt-js-1-1.png "[筆記] Nuxt 關於 SCSS 的引入寫法注意事項")
[筆記] Nuxt 關於 SCSS 的引入寫法注意事項
近期在維護一個 Nuxt 2 搭配 SCSS 進行的專案時，發現每當修改部分的 SCSS 檔案時，Hot Reload 屢屢觸發 Out of memory。經 Read More …
![[筆記] HTML 巢狀 div 所造成的縮排效果](https://smlpoints.com/wp-content/uploads/notes-html5-input-time-format-1.jpg "[筆記] HTML 巢狀 div 所造成的縮排效果")
[筆記] HTML 巢狀 div 所造成的縮排效果
若要達成層級的縮排效果，除了每層改變 padding 的大小外，還有藉由 HTML 結構來達成的方式。藉由 HTML 的巢狀結構和「相同的 CSS」設定，就可以 Read More …
[筆記] Tailwind css – 含 RWD 的三欄式卡片製作
從 Tailwind CSS 問世以來，也經歷過了數年發展來到第 3 代。這回筆記下 tailwind css 實作一個三欄式卡片製作。 內容 1. 三欄時的寬 Read More …
