个人网站怎么制作html_个人静态html网站制作流程【指南】

纯html个人网站只需一个index.html文件，所有资源用相对路径（如./css/style.css），添加viewport元标签实现响应式，github pages部署时注意子路径适配。

怎么用纯 HTML 写出能直接打开的个人网站

不需要服务器、不依赖平台，只要一个 index.html 文件，双击就能在浏览器里打开——这是最轻量的个人网站形态。关键不是“写得多漂亮”，而是结构清晰、路径写对、资源能加载出来。

• 所有资源（图片、CSS、JS）必须用相对路径，比如 ./css/style.css 或 images/me.jpg，别用 C:/xxx 或 /css/style.css（开头的 / 会从系统根目录找）
• <img alt="个人网站怎么制作html_个人静态html网站制作流程【指南】" > 的 src、<link> 的 href、<script></script> 的 src 都得检查一遍是否拼错文件名或大小写——Windows 不敏感，macOS/Linux 敏感
• 中文文件名尽量避免，浏览器可能乱码；空格和括号（如 my photo.jpg）容易导致路径失效，换成 my-photo.jpg

本地预览时 CSS/JS 不生效的常见原因

不是代码写错了，大概率是路径或加载时机问题。浏览器控制台（F12 → Console / Network 标签页）里看到 404 或 Failed to load resource 就是铁证。

• 确认 <link rel="stylesheet" href="style.css"> 中的 style.css 和 index.html 在同一目录；如果 CSS 在 css/ 子目录，就得写 ./css/style.css
• JS 放在 底部比放在 更稳妥，否则可能操作 DOM 时元素还没加载完；非要放 ，加 defer 属性：

  <script src="main.js" defer></script></li>
  <li>Chrome 直接双击打开 <code>file://

  协议页面时，部分 JS API（如 fetch 读本地 JSON）会被禁用，这时得用 Live Server 插件起个本地 HTTP 服务

怎么让手机也能正常看你的 HTML 网站

默认情况下，桌面写的 HTML 在手机上会缩成一团小字，或者横向滚动——这不是样式问题，是缺少响应式基础声明。

千博企业网站管理系统个人SQL版20120128

千博企业网站管理系统个人版免费下载、免费使用、功能无限制，完全免费拥有(请尊重开发者版权，保留首页底部版权显示)：内含Flash动画源码、Access数据库程序包、SQL数据库程序包。 千博企业网站管理系统个人版特点： 1.全站模块化操作，静态标签调用，更强扩展性… 千博企业网站系统个人版是一套基于.Net + Access(SQL)建站管理系统软件、不依赖于服务商特定空间、不需安装任何空间商组

下载

• 必须在 里加这行：<meta name="viewport" content="width=device-width, initial-scale=1">，否则所有媒体查询（@media）都白搭
• 图片别写死 width: 500px，改用 max-width: 100%; height: auto;，不然在窄屏上直接溢出
• 字体大小别全用 px，至少标题用 rem 或 em，配合上面的 viewport 才能随设备缩放

部署到 GitHub Pages 后样式丢失或图片打不开

本地好好的，一上传就崩，90% 是因为 GitHub Pages 默认以项目根目录为网站根路径，而你本地测试时是以当前文件夹为根。

立即学习“前端免费学习笔记（深入）”；

• 如果你的仓库是 username.github.io，那 index.html 必须在根目录，所有路径按“网站根目录”来写，比如 ./css/style.css 是对的
• 但如果你是普通项目（比如 username.github.io/my-portfolio），GitHub Pages 会把 my-portfolio 当作子路径，此时 ./css/style.css 实际请求的是 /css/style.css（漏了前缀），得改成 /my-portfolio/css/style.css，或更可靠地用相对路径： css/style.css（去掉开头的 .）
• GitHub Pages 默认不支持 .html 后缀省略（比如访问 /about 不会自动找 /about.html），所以导航链接老老实实写全 about.html