HTML作品集

artemiifrid_portfolio — HTML 作品集模板

作者 TemaDeveloper

基于 HTML、CSS 和 JavaScript 的响应式个人作品集网站模板,内容集中在 src 目录,并配有 GitHub Actions 自动部署到 GitHub Pages 的工作流。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

2 个预览视图
桌面端首页1 / 2
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 2

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-12查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

纯 HTML、CSS、JavaScript 静态页面,无需后端即可运行

02

内容集中在 src 目录,README 指出修改少量文件即可替换个人信息与项目内容

03

内置 GitHub Actions 工作流,推送 main 分支后自动部署到 GitHub Pages

04

提供桌面端与移动端在线演示,便于直接查看响应式效果

05

仓库包含 MIT 许可证文件,代码可免费使用、修改与分发

模板详细介绍

这是一个面向开发者个人作品集的静态网站模板,使用 HTML、CSS 和 JavaScript 构建,仓库同时提供在线演示。页面内容与样式集中在 src 目录,README 说明主要修改 index.html 以及相关文件即可更新姓名、简介、经历和项目描述,图片放在 src/assets/ 中替换。

模板自带 GitHub Actions 工作流(.github/workflows/main.yml),在向 main 分支推送变更后自动构建并部署到 GitHub Pages;使用前需要在仓库 Settings > Pages 中将 Source 设为 GitHub Actions。

许可方面,仓库包含 MIT 许可证文件,允许使用、修改、商用和分发该版本代码,分发时需保留版权与许可声明。演示图片、字体、图标等第三方素材需单独核对其许可,域名、托管等外部服务可能产生费用。

HTML作品集

适合你的项目吗?

适用场景

  • 开发者搭建个人作品集网站并发布到 GitHub Pages
  • 以现有页面为基础替换文案与图片,快速形成个人主页
  • 作为学习 HTML、CSS、JavaScript 静态站点结构与 GitHub Actions 部署的示例项目

适合人群

  • 希望用静态页面展示个人简介与项目作品的开发者
  • 使用 GitHub 托管代码并愿意通过 GitHub Pages 发布站点的用户
  • 需要一份可自由修改的 MIT 许可作品集模板的个人或团队

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    克隆或 fork 仓库后,在 src 目录中修改 index.html 等文件以更新文本、图片和链接

  2. 2

    将 src/assets/ 中的占位图片替换为自己的头像与项目截图

  3. 3

    把代码推送到自己的 GitHub 仓库,并在 Settings > Pages 中将 Source 设为 GitHub Actions,工作流会在 main 分支更新后自动部署

  4. 4

    替换演示图片、字体、图标等第三方素材前,需按各自许可单独核对

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
  • 模板的自动部署依赖 GitHub Actions 与 GitHub Pages 服务,需要将代码托管在 GitHub 仓库并在 Settings > Pages 中把 Source 设为 GitHub Actions,否则该自动化流程无法使用。
  • 作者希望使用该模板搭建个人作品集时能给仓库点星,这属于礼貌性请求而非强制许可条件,不影响代码的免费使用与分发。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

**GitHub Actions CI/CD:** Automatically deploy your latest changes to GitHub Pages.

README 原文

If you use this template for your own portfolio, a star on the repository would be greatly appreciated!

README 原文
https://github.com/TemaDeveloper/artemiifrid_portfolio/blob/main/LICENSEhttps://github.com/TemaDeveloper/artemiifrid_portfolio/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-12。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 83 / 100
技术栈
HTML
网站类型
作品集
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2026-09-25
截图检查日期
2026-10-12

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 HTML。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

审核声明: [email protected] · 2026-10-13

查看当时使用的来源资料

SHA-256: e29d6ca73b60ee3beb2c7a61cf9b5795ea06751fc878f1564f43594ed5cd1eed

2026-10-12T16:55:08.543Z

来源文件 / 仓库
# Modern Developer Portfolio Template

A clean, modern, and fully responsive portfolio website template built with HTML, CSS, and JavaScript. This repository provides an excellent starting point for developers who want to create a beautiful and professional online presence.

**Live Demo:** [**https://temadeveloper.github.io/artemiifrid_portfolio/**](https://temadeveloper.github.io/artemiifrid_portfolio/)

---

## ✨ Features

* **Sleek & Modern Design:** A professional design that makes a great first impression.
* **Fully Responsive:** Looks great on all devices, from mobile phones to desktops.
* **Easy to Customize:** Edit 3 files to update your personal information, projects, and experience.
* **GitHub Actions CI/CD:** Automatically deploy your latest changes to GitHub Pages.
* **Free to Use:** Open-source and ready for you to clone, modify, and make your own!

---

## 🚀 Getting Started

Anyone can use this template! Feel free to **clone** or **fork** this repository and modify it to build your own portfolio.

### 1. Get the Code

Clone the repository to your local machine using git:

```bash
git clone https://github.com/TemaDeveloper/artemiifrid_portfolio.git
cd artemiifrid_portfolio
```

### 2. Customize Your Content

All the main content is located in the `src` directory. Open the `index.html` file and other relevant files to change the following:

* **Text:** Update your name, bio, experience, and project descriptions.
* **Images:** Replace the placeholder images in the `src/assets/` folder with your own profile picture and project screenshots.
* **Links:** Add your social media links (LinkedIn, GitHub, etc.) and links to your live projects.

---

## 🌐 Deployment with GitHub Pages & Actions

This project is configured for easy, automated deployment using GitHub Actions.

### How It Works

The workflow file located at `.github/workflows/main.yml` will automatically build and deploy your site to the `main` branch of your repository whenever you push a change to the `main` branch. GitHub Pages then serves the website from that branch.

### Setup Instructions

1.  **Push to Your Own Repository:** After cloning, make sure to create your own new repository on GitHub and push the code to it.
2.  **Enable GitHub Pages:**
    * In your new repository, go to **Settings** > **Pages**.
    * Under "Build and deployment", select the **Source** as **GitHub Actions**.

---

## 🤝 Contributing

This is an open-source project, and contributions are welcome. If you have ideas for improvements or find any bugs, feel free to open an issue or submit a pull request.

If you use this template for your own portfolio, a star on the repository would be greatly appreciated!

---

## 📄 License

This project is open source and available under the [MIT License](https://opensource.org/licenses/MIT).
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。