From 4dd834005ce34e0888e8e78e701a74313e2313b5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8E=8A=E5=AE=87=E8=93=81?= Date: Sun, 7 Dec 2025 20:38:53 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E8=AA=BF=E6=95=B4HTML=E7=B5=90=E6=A7=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 433 ++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 398 insertions(+), 35 deletions(-) diff --git a/index.html b/index.html index 6a09c3c..ab43894 100644 --- a/index.html +++ b/index.html @@ -1,37 +1,400 @@ - - - - - - - - - - - - \ No newline at end of file + + + \ No newline at end of file From e80de12f335e15c6dbe6cafaa44c6b6bf8d6b125 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8E=8A=E5=AE=87=E8=93=81?= Date: Sun, 7 Dec 2025 20:57:28 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E8=AA=BF=E6=95=B4=E7=B5=90=E6=A7=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 607 +++++++++++++++++++---------------------------------- 1 file changed, 214 insertions(+), 393 deletions(-) diff --git a/index.html b/index.html index ab43894..a5aad58 100644 --- a/index.html +++ b/index.html @@ -1,400 +1,221 @@ - Your Name · Frontend Dev — 個人品牌網站
-
- -
-
-
-

個人品牌 — 前端工程師骨架網站

-

- 這是 Phase 1 的骨架版面：用於介紹個人背景、技能、作品集與聯絡方式。此區目前為占位內容，之後會用 Section SDD 的 Prompt 產生正式文案與版面，請把整個 section 整段貼回來取代這一區。 -

- -
- 瀏覽作品集 - 寄信給我 -
+ + + + + Your Name · Frontend Dev — 個人品牌網站 + + + + +
+
+ - -
- 開發者在筆電前工作的情境照片 -
-
-
- - - -
-
-
-

關於我（之後會用 Section SDD 替換）

-

這裡目前是 About 區的占位內容，用一句話說明：此區將用來撰寫完整的自我介紹、工作經歷摘要與專業定位。之後會用 Section SDD 的 Prompt 產生新的 section，請把新的 section 程式碼整段貼回來，完全取代這一區。

-

目前示意為單欄排版；在寬螢幕（≥768px）會自動改為左右欄式樣。

-
- -
-
- - - -
-
-

技能（之後會用 Section SDD 替換）

-

這裡目前是 Skills 區的占位內容。未來會列出技術堆疊、工具、熟悉程度與證照或學習筆記。之後會用 Section SDD 的 Prompt 產生新的 section，請把新的 section 程式碼整段貼回來，完全取代這一區。

- -
- HTML - CSS - RWD - Accessibility - Git - Design Systems -
-
-
- - - -
-
-

作品集（之後會用 Section SDD 替換）

-

這裡目前是 Projects 區的占位內容。未來會放置作品卡片（Preview、技術說明、連結），並能用 Section SDD 產生更完整版面。請把新的 section 程式碼整段貼回來，完全取代這一區。

- -
-
-

示意 Project A

-

此為占位的作品描述，將以實際專案資料替換。

-
- -
-

示意 Project B

-

此為占位的作品描述，將以實際專案資料替換。

-
-
-
-
- - - -
-
-

聯絡我（之後會用 Section SDD 替換）

-

這裡目前是 Contact 區的占位內容。未來會提供聯絡表單、社群連結與下載履歷按鈕等。之後會用 Section SDD 的 Prompt 產生新的 section，請把新的 section 程式碼整段貼回來，完全取代這一區。

- -
-
- - hello@example.com -
-
- - +886 900 000 000 + + +
+
+
+
+

個人品牌 — 前端工程師骨架網站

+

+ 這是 Phase 1 的骨架版面：用於介紹個人背景、技能、作品集與聯絡方式。之後會用 Section SDD 的 Prompt 產生正式文案，再整段貼回來取代此區。 +

+
+ 瀏覽作品集 + 寄信給我 +
+
+
+ 開發者在筆電前工作的情境照片 +
-
- - GitHub / yourname +
+ +
+
+
+

關於我（之後會替換）

+

這裡是暫時的 About 區塊內容。未來會放上正式的自我介紹、經歷與定位文字。

+

在寬螢幕版本會自動切換成左右欄排版。

+
+
-
- - LinkedIn / yourname +
+ +
+
+

技能（之後會替換）

+

此區將列出技術堆疊、工具、熟悉程度與證照。

+
+ HTML + CSS + RWD + Accessibility + Git + Design Systems +
-
-
-
- -
+ -
-
- © Your Name · Frontend Dev — 版權所有 - +
+
+

作品集（之後會替換）

+

這裡目前是作品集區的占位內容。

+
+
+
-
-
\ No newline at end of file + + \ No newline at end of file From 520934b044391c0048304b4fff88e6a802d72d8b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=8E=8A=E5=AE=87=E8=93=81?= Date: Sun, 7 Dec 2025 21:07:49 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=B0=B4=E5=B9=B3?= =?UTF-8?q?=E6=8D=B2=E5=8B=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 372 ++++++++++++++++++++++++----------------------------- 1 file changed, 165 insertions(+), 207 deletions(-) diff --git a/index.html b/index.html index a5aad58..b761bf1 100644 --- a/index.html +++ b/index.html @@ -1,221 +1,179 @@ - + - - - Your Name · Frontend Dev — 個人品牌網站 - - + @media (max-width: 768px) { + .hero h1 { font-size: 36px; } + .hero p { font-size: 18px; } + } + @media (max-width: 320px) { + body { padding: 0; overflow-x: hidden; } + .hero h1 { font-size: 28px; } + } + -
-
- +
+
+ +
-
-
-
-
-

個人品牌 — 前端工程師骨架網站

-

- 這是 Phase 1 的骨架版面：用於介紹個人背景、技能、作品集與聯絡方式。之後會用 Section SDD 的 Prompt 產生正式文案，再整段貼回來取代此區。 -

-
- 瀏覽作品集 - 寄信給我 -
-
-
- 開發者在筆電前工作的情境照片 -
-
-
+
+

Timothy Chuang

+

Web Developer • App Developer • UI/UX Designer

+
-
-
-
-

關於我（之後會替換）

-

這裡是暫時的 About 區塊內容。未來會放上正式的自我介紹、經歷與定位文字。

-

在寬螢幕版本會自動切換成左右欄排版。

-
- -
-
+
+

About Me

+

Hello! I'm Timothy, a developer who loves building beautiful and efficient digital experiences.

+
-
-
-

技能（之後會替換）

-

此區將列出技術堆疊、工具、熟悉程度與證照。

-
- HTML - CSS - RWD - Accessibility - Git - Design Systems -
+
+

Skills

+
+
HTML
+
CSS
+
JavaScript
+
React
+
Node.js
+
UI / UX
-
+
-
-
-

作品集（之後會替換）

-

這裡目前是作品集區的占位內容。

+
+

Projects

+
+
+ Project 1 screenshot +

Project One

+

A cool interactive web application.

+
+
+ Project 2 screenshot +

Project Two

+

A mobile-friendly responsive design project.

+
-
-
-
+ + + - \ No newline at end of file +