作品集網站技能
生成專業的個人作品集網站：包含英雄區塊、專案展示網格、關於區塊和聯絡表單。風格簡潔、注重排版、極簡。
後設資料
名稱： portfolio-site 描述： 生成一個包含英雄區塊、專案展示、關於區塊和聯絡區段的專業個人作品集網站。 觸發關鍵字： "portfolio", "personal website", "developer portfolio", "creative portfolio", "resume site"
輸入與參數
| 參數 | 類型 | 必填 | 預設值 |
|---|---|---|---|
name | string | ✓ | — |
tagline | string | ✓ | — |
projects | array | ✓ | — |
github_url | string | — | — |
linkedin_url | string | — | — |
email | string | — | — |
years_experience | number | — | 3 |
skills | array | — | [] |
專案陣列項目：
{ title: string; description: string; tags: string[]; url?: string; image?: string }
必備區段（依序）
- 導覽列 — 以姓名作為標誌，連結：專案 / 關於 / 聯絡
- 英雄區塊 — 姓名、標語、一行價值主張、社交連結（GitHub、LinkedIn、電子郵件）
- 專案網格 — 3 欄響應式網格，每張卡片：標題 + 描述 + 標籤 + 連結
- 關於區塊 — 雙欄：左側自傳文字，右側技能/統計資料
- 聯絡區塊 — 簡單表單：姓名、電子郵件、訊息、送出按鈕
- 頁尾 — 版權資訊 + 社交連結
設計規則
- 單頁、完全響應式
- 預設暗色模式（使用 DESIGN.md 的暗色模式記號）
- 所有連結應在新分頁開啟
- 無外部 JS 函式庫
- 所有 CSS 內嵌於
<style>區塊 - 語意化 HTML5（
<header>、<nav>、<main>、<section>、<footer>）
輸出
單一檔案：index.html（完全自包含）
自我檢查清單
- 英雄區塊標題為姓名，非「歡迎」
- 至少顯示 4 個專案
- 社交連結使用 SVG 圖示（非 emoji）
- 行動裝置：單欄網格
- 聯絡表單沒有損毀的
action屬性