KaiGe炫酷簡(jiǎn)約個(gè)人主頁(yè)

– ?? ** 現(xiàn)代化設(shè)計(jì) ** – 簡(jiǎn)約白色主題，優(yōu)雅的視覺(jué)效果
– ?? ** 個(gè)人信息展示 ** – 集成 QQ 頭像，個(gè)人介紹和技能展示
– ?? ** 三個(gè)獨(dú)立終端 ** – 云服務(wù)器推廣、QQ 技術(shù)交流群、開(kāi)發(fā)狀態(tài)展示
– ? ** 豐富背景特效 ** – 網(wǎng)格動(dòng)畫、流動(dòng)線條、星空效果、光暈、幾何形狀變換
– ?? ** 響應(yīng)式布局 ** – 適配各種屏幕尺寸
– ?? ** 單文件解決方案 ** – 所有代碼集成在一個(gè) HTML 文件中
– ? ** 性能優(yōu)化 ** – 純 CSS 動(dòng)畫，流暢不卡頓

##???? 預(yù)覽

##???? 技術(shù)棧

– **HTML5** – 語(yǔ)義化結(jié)構(gòu)
– **CSS3** – 現(xiàn)代化樣式和動(dòng)畫
– **JavaScript** – 交互功能和動(dòng)態(tài)效果
– **Font Awesome** – 圖標(biāo)庫(kù)
– **Google Fonts** – JetBrains Mono & Inter 字體

##??? 快速開(kāi)始

###? 本地運(yùn)行

1. 克隆項(xiàng)目
“`bash
git?clone?https://github.com/KaiGe7384/personal-homepage.git
cd?personal-homepage
“`

2. 直接在瀏覽器中打開(kāi) `index.html` 文件即可

###? 在線訪問(wèn)

訪問(wèn) GitHub Pages 部署的版本：
[https://kaige7384.github.io/personal-homepage/](

)

##??? 主要功能模塊

###? 個(gè)人信息區(qū)域
– QQ 頭像自動(dòng)加載（QQ 號(hào)：1732418）
– 個(gè)人昵稱：a’ ゞ 夢(mèng)玄詩(shī)
– 技能標(biāo)簽和統(tǒng)計(jì)數(shù)據(jù)
– 社交媒體鏈接

###? 終端窗口展示

###? 背景特效系統(tǒng)
– 動(dòng)態(tài)網(wǎng)格線條
– 幾何形狀變換動(dòng)畫
– 流動(dòng)線條效果
– 星空閃爍效果
– 光暈浮動(dòng)動(dòng)畫
– 噪聲紋理背景

##??? 自定義配置

###? 修改個(gè)人信息
在 `index.html` 中找到以下部分進(jìn)行修改：

“`html
<!– 頭像 QQ 號(hào) –>
<img?src=“https://q1.qlogo.cn/g?b=qq&nk=1732418&s=640”?alt=“a’ ゞ 夢(mèng)玄詩(shī) ”?class=“avatar-img”>

<!– 個(gè)人昵稱 –>
<h2?class=“avatar-name”>a’ ゞ 夢(mèng)玄詩(shī) </h2>

###? 修改配色主題
在 CSS 變量中調(diào)整顏色：

“`css
:root?{
–accent-1:?#2563eb;??/* 主要強(qiáng)調(diào)色 */
–accent-2:?#3b82f6;??/* 次要強(qiáng)調(diào)色 */
–accent-3:?#1d4ed8;??/* 深色強(qiáng)調(diào)色 */
}
“`

##??? 響應(yīng)式支持

– ? 桌面端 (1200px+)
– ? 平板端 (768px – 1199px)
– ? 手機(jī)端 (< 768px)

##??? 瀏覽器兼容性

– ? Chrome 60+
– ? Firefox 55+
– ? Safari 12+
– ? Edge 79+

##??? 許可證
MIT License – 詳見(jiàn) [LICENSE](LICENSE) 文件
##??? 貢獻(xiàn)
歡迎提交 Issue 和 Pull Request！

? 如果這個(gè)項(xiàng)目對(duì)您有幫助，請(qǐng)給個(gè) Star 支持一下！

下載鏈接：