鐵人檔案
🔹 1. 採用 7–1 Pattern (最常見的 SCSS 架構) 所謂 7–1 pattern 就是 7 個資料夾 + 1 個入口檔案。目的是把 樣式依用途...
📌 資料夾架構 scss/│── abstracts/ # 抽象層：變數、函式、mixin│── base/ # 基礎樣式：reset、typ...
在網頁中，表單（Form）通常用來收集使用者資料，例如註冊帳號、登入、送出聯絡資訊。表單的基礎是 標籤，裡面放各種輸入元件。 1️⃣ 基本結構 HTML &l...
3️⃣ UX 小技巧 1.保持簡潔：只問必要的欄位，太多會讓人放棄。 2.加上 placeholder：讓使用者知道該輸入什麼。 3.表單驗證：用 requir...
對許多剛入門前端設計的朋友來說，從零開始寫 CSS 可能會覺得有點困難。這時候，Bootstrap 5 就像是一套好用的工具箱，幫助我們快速打造美觀又響應式（R...
三、Bootstrap 的核心概念：網格系統（Grid System） Bootstrap 最強大的地方之一就是它的網格系統。這讓你可以很容易地排列版面。 📦...
五、讓網頁變得「響應式」 響應式設計是 Bootstrap 的核心特色之一。你只需要使用像是： HTML <div class="col-sm-...
Utilities (通用類別) Bootstrap 幫你準備了一堆 Utility classes，讓你不用自己寫 CSS。常見的種類有： 顏色 HTML &...
Helpers (工具輔助類別) 這些比較「特殊」，針對特定情境才用得上。 ✅ .clearfix 清除浮動，讓容器正常包覆內容。 HTML <div c...
🔹 方法 1：用 CSS 覆蓋（最常用） Bootstrap 本質上就是一堆 CSS，所以你只要在 自己的 CSS 檔案（要放在 Bootstrap 之後）加上...
