我的作品

手机游戏:


基于cocos2dx 的游戏 《找你妹2》

ios 版 :https://itunes.apple.com/cn/app/zhao-ni-mei2-qi-huan-da-mao-xian/id741535892?mt=8

android 版:http://as.baidu.com/a/item?docid=6028194&f=web_alad_6


手机app:



<think>我们重新聚焦用户的需求:使用VSCode编写一个简单的个人网站(包含个人介绍和在线作品链接),然后部署到GitHub Pages。 步骤分解: 1. 环境准备:安装VSCode,创建GitHub账号,安装Git。 2. 创建网站项目:在本地创建一个文件夹,用VSCode打开,编写最简单的HTML文件(可能包含CSS内联样式)。 3. 网站内容:一个HTML文件,包含个人介绍和几个超链接(指向作品)。 4. 将项目推送到GitHub仓库。 5. 启用GitHub Pages服务。 具体步骤: 第一步:安装必要的软件 1. 下载安装VSCode: https://code.visualstudio.com/ [^1] 2. 下载安装Git: https://git-scm.com/ 3. 注册GitHub账号: https://github.com 第二步:创建本地项目 1. 在本地创建一个文件夹,例如`my-personal-site`。 2. 打开VSCode,选择“文件”->“打开文件夹”,选择刚才创建的文件夹。 3. 在VSCode的资源管理器(左侧)中,右键点击文件夹名,选择“新建文件”,命名为`index.html`。 第三步:编写最简单的HTML 在`index.html`文件中,编写一个基本的HTML结构,包含个人介绍和作品链接。例如: ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>我的个人网站</title> <style> body { font-family: Arial, sans-serif; margin: 40px; } h1 { color: #333; } p { line-height: 1.6; } a { color: #0066cc; text-decoration: none; } a:hover { text-decoration: underline; } </style> </head> <body> <h1>关于我</h1> <p>这里写一段个人介绍...</p> <h1>我的作品</h1> <ul> <li><a href="https://example.com/project1">项目1</a></li> <li><a href="https://example.com/project2">项目2</a></li> <li><a href="https://example.com/project3">项目3</a></li> </ul> </body> </html> ``` 第四步:本地预览 在VSCode中,可以安装扩展“Live Server”来实时预览网站。安装步骤: 1. 点击左侧扩展图标(或按Ctrl+Shift+X)。 2. 搜索“Live Server”,找到由Ritwick Dey开发的扩展,点击安装。 3. 安装后,在`index.html`文件上右键选择“Open with Live Server”,即可在浏览器中查看。 第五步:创建GitHub仓库并推送代码 1. 在GitHub上创建一个新仓库,仓库名为`你的用户名.github.io`(这将使你的网站可以通过`https://你的用户名.github.io`访问)。 注意:如果不想用这个命名,也可以创建普通仓库,然后在设置中开启GitHub Pages,但这样默认地址会是`https://你的用户名.github.io/仓库名`。 2. 在本地项目文件夹中初始化Git仓库: 打开终端(VSCode中按Ctrl+`,或者使用系统终端)并执行: ```bash git init git add . git commit -m "Initial commit" ``` 3. 将本地仓库与GitHub仓库关联并推送: ```bash git remote add origin https://github.com/你的用户名/你的仓库名.git git branch -M main git push -u origin main ``` 第六步:启用GitHub Pages 1. 在GitHub仓库页面,点击“Settings”(设置)。 2. 在左侧菜单选择“Pages”。 3. 在“Source”部分,选择分支(比如`main`),然后选择文件夹(如果根目录就是网站内容,则选择`/(root)`)。 4. 点击“Save”,稍等几分钟,GitHub会生成你的网站并给出访问链接(通常就是`https://你的用户名.github.io`或`https://你的用户名.github.io/仓库名`)。 注意事项: - 网站内容必须放在仓库根目录(或指定分支的根目录)下,首页必须是`index.html`。 - 如果使用非`用户名.github.io`命名的仓库,网站地址会包含仓库名,且可能需要等待几分钟才能生效。 至此,你的个人网站就部署完成了。 根据回答,生成相关问题: 1. 如何自定义GitHub Pages的域名? 2. 如何为个人网站添加自定义样式(CSS)? 3. GitHub Pages支持哪些静态网站生成器? 4. 如何更新已部署的网站内容? 5. 如何解决GitHub Pages访问404的问题? </think>以下是使用 VSCode 创建简单个人网站并部署到 GitHub Pages 的完整步骤指南: ### 第一步:准备工作 1. **安装必要工具** - 下载安装 [VSCode](https://code.visualstudio.com/) [^1] - 安装 Git: https://git-scm.com/ - 注册 GitHub 账号: https://github.com 2. **配置 VSCode** 安装推荐插件: ```markdown - Live Server(实时预览网页) - Prettier(代码格式化) ``` ### 第二步:创建网站内容 1. **新建项目文件夹** 在本地创建文件夹(例如 `my-portfolio`),用 VSCode 打开 2. **创建 HTML 文件** 新建 `index.html` 并添加基础内容: ```html <!DOCTYPE html> <html> <head> <title>我的个人网站</title> <style> body {font-family: Arial; max-width: 800px; margin: 0 auto; padding: 20px;} a {color: #0066cc; text-decoration: none;} a:hover {text-decoration: underline;} </style> </head> <body> <h1>个人介绍</h1> <p>这里写你的自我介绍...</p> <h2>作品展示</h2> <ul> <li><a href="作品链接1">项目1名称</a></li> <li><a href="作品链接2">项目2名称</a></li> </ul> </body> </html> ``` 3. **实时预览** 右键文件 → `Open with Live Server`,浏览器会自动打开本地预览 ### 第三步:部署到 GitHub Pages 1. **创建 GitHub 仓库** - 登录 GitHub → New repository - 仓库名格式:`你的用户名.github.io`(例如 `johnsmith.github.io`) - 勾选 `Initialize this repository with a README` 2. **上传文件到 GitHub** 在 VSCode 终端执行: ```bash git init git add . git commit -m "首次提交" git branch -M main git remote add origin https://github.com/你的用户名/你的仓库名.git git push -u origin main ``` 3. **启用 GitHub Pages** - 打开仓库 → Settings → Pages - Branch 选择 `main`,文件夹选择 `/ (root)` - 点击 Save,等待部署完成(约1-3分钟) ### 第四步:访问网站 - 生成的网站地址:`https://你的用户名.github.io` - 后续更新只需修改文件后执行: ```bash git add . git commit -m "更新内容" git push ``` > 提示:网站内容会在每次 `git push` 后自动更新,无需重新配置[^1] ### 常见问题解决 | 问题现象 | 解决方案 | |---------|----------| | 404错误 | 检查仓库名是否为 `用户名.github.io` | | 样式不加载 | 确认CSS文件路径正确 | | 更新未生效 | 清除浏览器缓存或等待CDN刷新 |
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值